插入节点 appendChild() 在指定节点的最后一个子节点列表之后添加一个新的子节点。
插入节点 insertBefore() 方法可在已有的子节点前插入一个新的子节点。
删除节点 removeChild() 方法从子节点列表中删除某个节点。如删除成功，此方法可返回被删除的节点，如失败，则返回 NULL。
替换元素节点 replaceChild() 实现子节点(对象)的替换。返回被替换对象的引用
<body> <ul id="x"> <li id="x1">2</li> <li id="x1">3</li> </ul> <button onclick="qian()">前添加</button> <button onclick="hou()">后添加</button> <button onclick="shan()">删除</button> <button onclick="ti()">替换（替换2和3）</button> </body> <script> function hou(){ var x1 = document.getElementById("x"); var x2 = document.createElement("li"); x2.innerHTML = "4"; x1.appendChild(x2); } function qian(){ var xx1 = document.getElementById("x"); var xx2=document.getElementById("x1"); var xx3 = document.createElement("li"); xx3.innerHTML = "1"; xx1.insertBefore(xx3,xx2); } function shan(){ var xxx1=document.getElementById("x"); var xxx2=xxx1.removeChild(xxx1.childNodes[1]); } function ti(){ var z1 = document.createElement("en"); var z2 = document.getElementById("x1"); z1.innerHTML = z2.innerHTML; z2.parentNode.replaceChild(z1,z2); } </script>
原文：http://www.cnblogs.com/yjh1604600160/p/q-9.html