html dom节点

添加html节点

<div id="div1">
<p id="p1">这是一个段落。</p>
<p id="p2">这是另一个段落。</p>
</div>


<script>
var para=document.createElement("p");
var node=document.createTextNode("这是新段落。");
para.appendChild(node);


var element=document.getElementById("div1");
element.appendChild(para);
</script>

1、var para=document.createElement("p");  //创建一个元素p

2、var node=document.createTextNode("这是新段落。"); //创建文本节点

3、para.appendChild(node);   //在元素p中加入node节点

4、var element=document.getElementById("div1");
      element.appendChild(para);                                     //必须向一个已存在的元素追加新增的元素p

删除html元素

如需删除 HTML 元素，您必须首先获得该元素的父元素

<div id="div1">
<p id="p1">这是一个段落。</p>
<p id="p2">这是另一个段落。</p>
</div>


<script>
var parent=document.getElementById("div1");
var child=document.getElementById("p1");
parent.removeChild(child);
</script>

1、var parent=document.getElementById("div1");  //找到父元素

2、var child=document.getElementById("p1");    //找到子元素

3、parent.removeChild(child);   //删除

提示：如果能够在不引用父元素的情况下删除某个元素，就太好了。

不过很遗憾。DOM 需要清楚您需要删除的元素，以及它的父元素。

这是常用的解决方案：找到您希望删除的子元素，然后使用其 parentNode 属性来找到父元素：

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