XML DOM appendChild() 方法

Node 對象參考手冊

定義和用法

appendChild() 方法可向節點的子節點列表的末尾添加新的子節點。

此方法可返回這個新的子節點。

語法:

appendChild(newchild)
參數 描述
newchild 所添加的節點

返回值

加入的節點。

描述

該方法將把節點 newchild 添加到文檔中,使它成為當前節點的最后一個子節點。

如果文檔樹中已經存在了 newchild,它將從文檔樹中刪除,然后重新插入它的新位置。如果 newchild 是 DocumentFragment 節點,則不會直接插入它,而是把它的子節點按序插入當前節點的 childNodes[] 數組的末尾。

注意,來自一個文檔的節點(或由一個文檔創建的節點)不能插入另一個文檔。也就是說,newchild 的 ownerDocument 屬性必須與當前節點的 ownerDocument 屬性相同。

例子

下面的函數將在文檔末尾插入一個新段:

function appendMessage (message) {
  var pElement = document.createElement("p");
  var messageNode = document.createTextNode(message);
  pElement.appendChild(messageNode);
  document.body.appendChild(pElement);
}

實例

在所有的例子中,我們將使用 XML 文件 books.xml,以及 JavaScript 函數 loadXMLDoc()

下面的代碼片段可創建并向首個 <book> 元素添加一個節點,然后輸出首個 <book> 元素的所有子節點:

xmlDoc=loadXMLDoc("books.xml");
var newel=xmlDoc.createElement('edition');
var newtext=xmlDoc.createTextNode('First');
newel.appendChild(newtext);
var x=xmlDoc.getElementsByTagName('book')[0];
x.appendChild(newel);
var y=x.childNodes;
for (var i=0;i<y.length;i++)
  { 
  //Display only element nodes
  if (y[i].nodeType==1)
    { 
    document.write(y[i].nodeName);
    document.write("<br />");
    } 
  }

輸出:

title
author
year
price
edition

注釋:Internet Explorer 會忽略節點間生成的空白文本節點(例如,換行符號),而 Mozilla 不會這樣做。因此,在下面的例子中,我們僅處理元素節點(元素節點的 nodeType=1)。

提示:如需更多有關 IE 與 Mozilla 瀏覽器之間 XML DOM 的差異的內容,請訪問我們的 DOM 瀏覽器 章節。

Node 對象參考手冊