JavaScript基础(23)_DOM增删改

DOM增加对象

createElement():
含义：创建一个元素节点对象。
用法：它需要一个标签名作为参数，将会根据该标签名创建元素节点对象，并将创建好的对象作为返回值返回。比如：var li = document.createElement("li");

createTextNode():
含义：创建文本节点对象。
用法：需要一个文本内容作为参数，将会根据该内容创建文本节点，并将新的节点返回。比如：var text_node = document.createTextNode("广州");

appendChild():
含义：向一个父节点中添加一个新的子节点。
语法：父节点.appendChild(子节点)；

DOM删除对象

removeChild():
含义：删除一个子节点。
语法：父节点.removeChild(子节点);

DOM改动对象

insertBefore():
含义：在指定的子节点前面插入新的子节点。
语法：父节点.insertBefore(新节点,旧节点);

replaceChild():
含义：使用指定的子节点替换已有的子节点。
语法：父节点.replaceChild(新节点,旧节点);

父节点的获取：
1、直接找出父节点。比如：var city = document.getElementsByClassName("city")[0];
2、子节点.parentNode(推荐使用)。比如：city.insertBefore(li,sh);

代码示例：

    
    
    


    
你喜欢哪个城市？
    

        
上海
        
北京
        
厦门
        
深圳
        
天津