JavaScript HTML DOM 元素（节点）

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

创建新的 HTML 元素

如需向 HTML DOM 添加新元素，您必须首先创建该元素（元素节点），然后向一个已存在的元素追加该元素。

<html>
<body>
<div id="div1">

<p id="p1">这是一个段落</p>
<p id="p2">这是第二个段落</p>
</div>
<script type="text/javascript">
/*新增加一个子节点*/   
var para=document.createElement("p");
   var node= document.createTextNode("这是新段落!");
       para.appendChild(node);
        document.getElementById('p1').appendChild(para);
/*删除p2节点*/
var childElement = document.getElementById('p2');
var parentElement= document.getElementById('div1');
        parentElement.removeChild(childElement);
</script>
</body>
</html>

这段代码创建新的 <p> 元素：

var para=document.createElement("p");

如需向 <p> 元素添加文本，您必须首先创建文本节点。这段代码创建了一个文本节点：

   var node= document.createTextNode("这是新段落!");

然后您必须向 <p> 元素追加这个文本节点：

        document.getElementById('p1').appendChild(para);

最后您必须向一个已有的元素追加这个新元素。

这段代码找到一个已有的元素：

        document.getElementById('p1').appendChild(para);

删除已有的 HTML 元素

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

var parentElement= document.getElementById('div1');

找到 id="p1" 的 <p> 元素：

var parentElement= document.getElementById('div1');

从父元素中删除子元素：

        parentElement.removeChild(childElement);