如何添加子節點
代碼
<!DOCTYPE html>
<html>
<body>
<ul id="myList"><li>Coffee</li><li>Tea</li></ul>
<p id="demo">請點擊按鈕向列表中添加項目。</p>
<button onclick="myFunction()">親自試一試</button>
<script>
function myFunction()
{
var node=document.createElement("LI");
var
//創建新節點并儲存在變量node中。
textnode=document.createTextNode("Water");
//創建文本節點并儲存在變量textnode中。
node.appendChild(textnode);
//node代表母節點，textnode代表希望添加的節點。
document.getElementById("myList").appendChild(node);
}
</script>
<p><b>注釋：</b>首先創建 LI 節點，然后創建文本節點，然后把這個文本節點追加到 LI 節點。最后把 LI 節點添加到列表中。</p>
</body>
</html>
分析
首先createElement創建了一個元素標簽。
之后為這個元素創建了文本內容。（文本節點）
最后appendChild() 方法向節點添加最后一個子節點。
也就是把文本內容添加到元素的標簽中。
這三句的結果就是做了這么一件事，用html語言級數
<li>Water</li>
接下來還有一件事，就是這句插入到哪里？
document.getElementById("myList").appendChild(node);
這句表明插入的Mylist的最后一行里。
