Dom createElement()、createTextNode()、appendChild()、removeChild()、replaceChild()、insertBefore()、createDocumentFragment() //创建新节点 function CreatNode() { var oP = document.createElement("p"); oP.innerHTML = "<font style='color:red;'>Hello World!</font>"; document.body.appendChild(oP); }
//删除节点 function RemoveNode() { var oP = document.getElementsByTagName("p"); var len = oP.length; if (len != 0) { oP[len - 1].parentNode.removeChild(oP[len - 1]); //这里最好使用节点的parentNode特性来删除 } else { alert("已经全部删除!"); } } //替换节点 function ReplaceNode() { var oNewP = document.createElement("p"); oNewP.innerHTML = "<font style='color:red;'>New --> Hello World!</font>"; //将最后一个新增的节点替换成oNewP var len = document.getElementsByTagName("p").length; var oOldLastP = document.getElementsByTagName("p")[len - 1]; oOldLastP.parentNode.replaceChild(oNewP, oOldLastP); } //insertBefore()方法 让新消息出现在旧消息之前,接受两个参数: 1.要添加的节点;2.插在哪个节点之前 xxx.parentNode.insertBefore(newChild, oldChild); //createDocumentFragment()方法 创建文档碎片 可以把一些创建的十个新的节点元素都添加到文档碎片中,然后这个碎片作为参数传递给要添加碎片的appendChild() xxx.appendChild(oFragment); 这样xxx只调用了一次来代替调用十次,提高性能。