XML DOM 創(chuàng)建節(jié)點(diǎn)


tryitimg.gif嘗試一下 - 實(shí)例


下面的實(shí)例使用 XML 文件 books.xml。
函數(shù) loadXMLDoc(),位于外部 JavaScript 中,用于加載 XML 文件。

創(chuàng)建元素節(jié)點(diǎn)
本例使用 createElement() 來(lái)創(chuàng)建一個(gè)新的元素節(jié)點(diǎn),并使用 appendChild() 把它添加到一個(gè)節(jié)點(diǎn)中。

使用 createAttribute 創(chuàng)建屬性節(jié)點(diǎn)
本例使用 createAttribute() 來(lái)創(chuàng)建一個(gè)新的屬性節(jié)點(diǎn),并使用 setAttributeNode() 把它插入一個(gè)元素中。

使用 setAttribute 創(chuàng)建屬性節(jié)點(diǎn)
本例使用 setAttribute() 為一個(gè)元素創(chuàng)建一個(gè)新的屬性。

創(chuàng)建文本節(jié)點(diǎn)
本例使用 createTextNode() 來(lái)創(chuàng)建一個(gè)新的文本節(jié)點(diǎn),并使用 appendChild() 把它添加到一個(gè)元素中。

創(chuàng)建 CDATA section 節(jié)點(diǎn)
本例使用 createCDATAsection() 來(lái)創(chuàng)建一個(gè) CDATA section 節(jié)點(diǎn),并使用 appendChild() 把它添加到一個(gè)元素中。

創(chuàng)建注釋節(jié)點(diǎn)
本例使用 createComment() 來(lái)創(chuàng)建一個(gè)注釋節(jié)點(diǎn),并使用 appendChild() 把它添加到一個(gè)元素中。


創(chuàng)建新的元素節(jié)點(diǎn)

createElement() 方法創(chuàng)建一個(gè)新的元素節(jié)點(diǎn):

實(shí)例

<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js"> 
</script>
</head>
<body>

<script>
xmlDoc=loadXMLDoc("books.xml");

newel=xmlDoc.createElement("edition");

x=xmlDoc.getElementsByTagName("book")[0];
x.appendChild(newel);

document.write(x.getElementsByTagName("edition")[0].nodeName);
</script>
</body>
</html>

運(yùn)行實(shí)例 ?

點(diǎn)擊 "運(yùn)行實(shí)例" 按鈕查看在線實(shí)例

實(shí)例解釋:

  1. 使用 loadXMLDoc() 把 "books.xml" 載入 xmlDoc 中

  2. 創(chuàng)建一個(gè)新的元素節(jié)點(diǎn) <edition>

  3. 向第一個(gè) <book> 元素追加這個(gè)元素節(jié)點(diǎn)

遍歷并向所有 <book> 元素添加一個(gè)元素:嘗試一下


創(chuàng)建新的屬性節(jié)點(diǎn)

createAttribute() 用于創(chuàng)建一個(gè)新的屬性節(jié)點(diǎn):

實(shí)例

<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js"> 
</script>
</head>
<body>

<script>
xmlDoc=loadXMLDoc("books.xml");

newatt=xmlDoc.createAttribute("edition");
newatt.nodeValue="first";

x=xmlDoc.getElementsByTagName("title");
x[0].setAttributeNode(newatt);

document.write("Edition: ");
document.write(x[0].getAttribute("edition"));

</script>
</body>
</html>

運(yùn)行實(shí)例 ?

點(diǎn)擊 "運(yùn)行實(shí)例" 按鈕查看在線實(shí)例

實(shí)例解釋:

  1. 使用 loadXMLDoc() 把 "books.xml" 載入 xmlDoc 中

  2. 創(chuàng)建一個(gè)新的屬性節(jié)點(diǎn) "edition"

  3. 設(shè)置屬性節(jié)點(diǎn)的值為 "first"

  4. 向第一個(gè) <title> 元素添加這個(gè)新的屬性節(jié)點(diǎn)

遍歷所有的 <title> 元素,并添加一個(gè)新的屬性節(jié)點(diǎn):嘗試一下

注意:如果該屬性已存在,則被新屬性替代。


使用 setAttribute() 創(chuàng)建屬性

由于 setAttribute() 方法可以在屬性不存在的情況下創(chuàng)建新的屬性,我們可以使用這個(gè)方法來(lái)創(chuàng)建一個(gè)新的屬性。

實(shí)例

<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js"> 
</script>
</head>
<body>

<script>
xmlDoc=loadXMLDoc("books.xml");

x=xmlDoc.getElementsByTagName("title");

x[0].setAttribute("edition","first");

document.write("Edition: ");
document.write(x[0].getAttribute("edition"));

</script>
</body>
</html>

運(yùn)行實(shí)例 ?

點(diǎn)擊 "運(yùn)行實(shí)例" 按鈕查看在線實(shí)例

實(shí)例解釋:

  1. 使用 loadXMLDoc() 把 "books.xml" 載入 xmlDoc 中

  2. 為第一個(gè) <book> 元素設(shè)置(創(chuàng)建)值為 "first" 的 "edition" 屬性

遍歷所有的 <title> 元素并添加一個(gè)新屬性:嘗試一下


創(chuàng)建文本節(jié)點(diǎn)

createTextNode() 方法創(chuàng)建一個(gè)新的文本節(jié)點(diǎn):

實(shí)例

<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js"> 
</script>
</head>
<body>

<script>
xmlDoc=loadXMLDoc("books.xml");

newel=xmlDoc.createElement("edition");
newtext=xmlDoc.createTextNode("first");
newel.appendChild(newtext);

x=xmlDoc.getElementsByTagName("book")[0];
x.appendChild(newel);

//Output title and edition
document.write(x.getElementsByTagName("title")[0].childNodes[0].nodeValue);
document.write(" - Edition: ");
document.write(x.getElementsByTagName("edition")[0].childNodes[0].nodeValue);
</script>
</body>
</html>

運(yùn)行實(shí)例 ?

點(diǎn)擊 "運(yùn)行實(shí)例" 按鈕查看在線實(shí)例

實(shí)例解釋:

  1. 使用 loadXMLDoc() 把 "books.xml" 載入 xmlDoc 中

  2. 創(chuàng)建一個(gè)新元素節(jié)點(diǎn) <edition>

  3. 創(chuàng)建一個(gè)新的文本節(jié)點(diǎn),其文本是 "first"

  4. 向這個(gè)元素節(jié)點(diǎn)追加新的文本節(jié)點(diǎn)

  5. 向第一個(gè) <book> 元素追加新的元素節(jié)點(diǎn)

向所有的 <book> 元素添加一個(gè)帶有文本節(jié)點(diǎn)的元素節(jié)點(diǎn):嘗試一下


創(chuàng)建 CDATA Section 節(jié)點(diǎn)

createCDATASection() 方法創(chuàng)建一個(gè)新的 CDATA section 節(jié)點(diǎn)。

實(shí)例

<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js"></script>
</head>
<body>

<script>
xmlDoc=loadXMLDoc("books.xml");

newCDATA=xmlDoc.createCDATASection("Special Offer & Book Sale");

x=xmlDoc.getElementsByTagName("book")[0];
x.appendChild(newCDATA);

document.write(x.lastChild.nodeValue);
</script>
</body>
</html>

運(yùn)行實(shí)例 ?

點(diǎn)擊 "運(yùn)行實(shí)例" 按鈕查看在線實(shí)例

實(shí)例解釋:

  1. 使用 loadXMLDoc() 把 "books.xml" 載入 xmlDoc 中

  2. 創(chuàng)建一個(gè)新的 CDATA section 節(jié)點(diǎn)

  3. 向第一個(gè) <book> 元素追加這個(gè)新的 CDATA section 節(jié)點(diǎn)

遍歷并向所有 <book> 元素添加一個(gè) CDATA section:嘗試一下


創(chuàng)建注釋節(jié)點(diǎn)

createComment() 方法創(chuàng)建一個(gè)新的注釋節(jié)點(diǎn)。

實(shí)例

<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js"></script>
</head>
<body>

<script>
xmlDoc=loadXMLDoc("books.xml");

newComment=xmlDoc.createComment("Revised April 2008");

x=xmlDoc.getElementsByTagName("book")[0];
x.appendChild(newComment);

document.write(x.lastChild.nodeValue);
</script>
</body>
</html>

運(yùn)行實(shí)例 ?

點(diǎn)擊 "運(yùn)行實(shí)例" 按鈕查看在線實(shí)例

實(shí)例解釋:

  1. 使用 loadXMLDoc() 把 "books.xml" 載入 xmlDoc 中

  2. 創(chuàng)建一個(gè)新的注釋節(jié)點(diǎn)

  3. 把這個(gè)新的注釋節(jié)點(diǎn)追加到第一個(gè) <book> 元素

循環(huán)并向所有 <book> 元素添加一個(gè)注釋節(jié)點(diǎn):嘗試一下