添加和删除节点（HTML元素）

创建新的HTML元素

 1 <div id="div1">
 2 <p id="p1">这是一个段落</p>
 3 <p id="p2">这是另一个段落</p>
 4 </div>
 5 
 6 <script>
 7 var para=document.createElement("p");//创建新的<p>元素
 8 var node=document.createTextNode("这是新段落。");//创建新的文本节点
 9 para.appendChild(node);//向<p>元素追歼这个文本节点
10 //向一个已有元素追加这个新元素
11 var element=document.getElementById("div1");//找到一个已有元素
12 element.appendChild(para);//向这个已有元素追加新元素
13 </script>

删除已有的元素

 1 <div id="div1">
 2 <p id="p1">这是一个段落。</p>
 3 <p id="p2">这是另一个段落。</p>
 4 </div>
 5 
 6 <script>
 7 var parent=document.getElementById("div1");//找到父元素
 8 var child=document.getElementById("p1");//找到子元素
 9 parent.removeChild(child);//从父元素中删除子元素
10 </script>

DOM  需要清楚您需要删除的元素，以及他的父元素

可以使用子元素的parentNode属性来找父元素

1 var child=document.getElementById("p1");
2 child.parentNode.removeChild(child);

 

转载于:https://www.cnblogs.com/the-wang/p/7511859.html