document节点的操作2_document.body.appendchild(a)-优快云博客

本文详细介绍了如何使用JavaScript进行DOM操作，包括创建、删除、插入及替换节点等基本操作，并提供了具体的代码示例。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.创建节点

如果在网页上添加一个元素<p>hello world</p> //新建节点： var hNode=document.createElement("p"); //新建文本： var hText=document.createTextNode("hello world"); //将文本加入到节点中： hNode.appendChild(hText); //将节点加入到 document.body.appendChild(hNode);

2.删除节点

var hNode=document.body.getElementsByTagName.item(0); document.body.removeChild(hNode);

3.插入节点

var insert=document.createElement("p"); var insertText=document.createTextNode("inert a node"); insert.appendChild(insertText); var oldNode=document.getElementById("myHeader"); oldNode.parentNode.insertBefore(insert,oldNode); 在节点oldNode之上插入节点insert;

4.替换节点

var replace=document.createElement("p"); var replaceText=document.createTextNode("inert a node"); insert.appendChild(replaceText); var oldNode=document.getElementById("myHeader"); oldNode.parentNode.replaceChild(replaceText,oldNode); 新建节点replace,替换掉原来的节点oldNode;

5.同时插入多个节点

var oFragment=document.createDocumentFragment(); for(var i=0;i<20;i++){ var oP=document.createElement("p"); var oText=document.createTextNode(i); oP.appendChild(oText); oFragment.appendChild(oP); } document.body.appendChild(oFragement);