添加和移除元素
使用以下方法創(chuàng)建新節(jié)點(diǎn)：
element.cloneNode() 克隆元素并返回結(jié)果節(jié)點(diǎn)。
document.createElement(element) 創(chuàng)建一個(gè)新的元素節(jié)點(diǎn)。
document.createTextNode(text) 創(chuàng)建一個(gè)新的文本節(jié)點(diǎn)。
例如:
var node = document.createTextNode("一些新的文本");
這將創(chuàng)建一個(gè)新的文本節(jié)點(diǎn)，但它將不會(huì)出現(xiàn)在文檔中，直到您使用以下方法之一將其附加到現(xiàn)有元素：
element.appendChild(newNode) 將一個(gè)新的子節(jié)點(diǎn)添加到元素作為最后一個(gè)子節(jié)點(diǎn)。
element.insertBefore(node1, node2) 在節(jié)點(diǎn)2之前插入node1作為子節(jié)點(diǎn)。
例如:
<div id ="demo">一些文本</div>
<script>
//創(chuàng)建一個(gè)新的段落
var p = document.createElement("p");
var node = document.createTextNode("一些新的文本");
//添加文本到段落
p.appendChild(node);
var div = document.getElementById("demo");
//將段落添加到div中
div.appendChild(p);
</script>var el = document.("li");
var txt = document.createTextNode("B");
el.appendChild(txt);
var ul = document.getElementById("");
ul.(el);
移除元素
要?jiǎng)h除HTML元素，您必須選擇元素的父項(xiàng)并使用 removeChild(node) 方法。
例如:
<div id="demo">
<p id="p1">這是一個(gè)段落.</p>
<p id="p2">這是另外一個(gè)段落.</p>
</div>
<script>
var parent = document.getElementById("demo");
var child = document.getElementById("p1");
parent.removeChild(child);
</script>這樣會(huì)從頁(yè)面中刪除 id ="p1" 的段落。
提示: 實(shí)現(xiàn)相同結(jié)果的另一種方法是使用 parentNode 屬性來獲取要?jiǎng)h除的元素的父項(xiàng)：
var child = document.getElementById("p1");
child.parentNode.removeChild(child);var par = document.getElementById("par");
var node = document.getElementById("node");
.();
替換元素
要替換HTML元素，使用 element.replaceChild(newNode,oldNode) 方法。
例如:
<div id="demo">
<p id="p1">這是一個(gè)段落</p>
<p id="p2">這是另一個(gè)段落</p>
</div>
<script>
var p = document.createElement("p");
var node = document.createTextNode("這是新的文本");
p.appendChild(node);
var parent = document.getElementById("demo");
var child = document.getElementById("p1");
parent.replaceChild(p, child);
</script>提示: 上面的代碼創(chuàng)建一個(gè)替換現(xiàn)有 p1 段落的新段落元素。