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只调用了一次来代替调用十次,提高性能。
推荐整理分享JavaScript 学习笔记(十二) dom(javascript教程完整版),希望有所帮助,仅作参考,欢迎阅读内容。
文章相关热门搜索词:javascript基础笔记,javascript教程,javascript怎么学,javascript如何学,javascript如何学,javascript如何学,javascript教程推荐知乎,javascript基础笔记,内容如对您有帮助,希望把文章链接给更多的朋友!
JavaScript 学习笔记(十三)Dom创建表格 Dom基础—创建表格利用js来动态创建表格有两种格式,appendChild()和insertRow、insertCell()。但第一种有可能在IE上有问题,所以推荐使用第二种。1、insertRow(i
JavaScript 学习笔记(十四) 正则表达式 RegExp类RegExp对象的构造函数可以带一个或两个参数第一个参数是描述需要进行匹配的模式字符串,如果还有第二个参数,这个参数则制定了额外的处理
javascript 的Document属性和方法集合 document.title//设置文档标题等价于HTML的title标签document.bgColor//设置页面背景色document.fgColor//设置前景色(文本颜色)document.linkColor//未点击过的链接颜色docume