XML DOM 訪問節(jié)點(diǎn)

2018-02-11 14:46 更新

XML DOM - 訪問節(jié)點(diǎn)


通過 DOM,您能夠訪問 XML 文檔中的每個(gè)節(jié)點(diǎn)。

DOM 訪問節(jié)點(diǎn)的方法有三種,分別是:使用 getElementsByTagName() 方法、通過循環(huán)(遍歷)節(jié)點(diǎn)樹以及利用節(jié)點(diǎn)的關(guān)系在節(jié)點(diǎn)樹中導(dǎo)航


實(shí)例

嘗試一下 - 實(shí)例

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

使用節(jié)點(diǎn)列表中的索引號(hào)來訪問節(jié)點(diǎn)
本例使用 getElementsByTagname() 方法來獲取 "books.xml" 中的第三個(gè) <title> 元素。

使用 length 屬性來遍歷節(jié)點(diǎn)
本例使用 length 屬性來遍歷 "books.xml" 中的所有 <title> 元素。

查看元素的節(jié)點(diǎn)類型
本例使用 nodeType 屬性來獲取 "books.xml" 中根元素的節(jié)點(diǎn)類型。

遍歷元素節(jié)點(diǎn)
本例使用 nodeType 屬性來處理 "books.xml" 中的元素節(jié)點(diǎn)。

使用節(jié)點(diǎn)的關(guān)系來遍歷元素節(jié)點(diǎn)
本例使用 nodeType 屬性和 nextSibling 屬性來處理 "books.xml" 中的元素節(jié)點(diǎn)。


訪問節(jié)點(diǎn)

您可以通過三種方式來訪問節(jié)點(diǎn):

1. 通過使用 getElementsByTagName() 方法。

2. 通過循環(huán)(遍歷)節(jié)點(diǎn)樹。

3. 通過利用節(jié)點(diǎn)的關(guān)系在節(jié)點(diǎn)樹中導(dǎo)航。


getElementsByTagName() 方法

getElementsByTagName() 返回?fù)碛兄付?biāo)簽名的所有元素。

語法

node.getElementsByTagName("tagname");

實(shí)例

下面的實(shí)例返回 x 元素下的所有 <title> 元素:

x.getElementsByTagName("title");

請(qǐng)注意,上面的實(shí)例僅返回 x 節(jié)點(diǎn)下的 <title> 元素。如需返回 XML 文檔中的所有 <title> 元素,請(qǐng)使用:

xmlDoc.getElementsByTagName("title");

在這里,xmlDoc 就是文檔本身(文檔節(jié)點(diǎn))。


DOM 節(jié)點(diǎn)列表(Node List)

getElementsByTagName() 方法返回節(jié)點(diǎn)列表。節(jié)點(diǎn)列表是節(jié)點(diǎn)的數(shù)組。

下面的代碼使用 loadXMLDoc() 把 "books.xml" 載入 xmlDoc 中,然后在變量 x 中存儲(chǔ) <title> 節(jié)點(diǎn)的一個(gè)列表:

xmlDoc=loadXMLDoc("books.xml");

x=xmlDoc.getElementsByTagName("title");

可通過索引號(hào)訪問 x 中的 <title> 元素。如需訪問第三個(gè) <title>,您可以編寫:

y=x[2];

注意:該索引從 0 開始。

在本教程后面的章節(jié)中,您將學(xué)習(xí)更多有關(guān)節(jié)點(diǎn)列表(Node List)的知識(shí)。


DOM 節(jié)點(diǎn)列表長(zhǎng)度(Node List Length)

length 屬性定義節(jié)點(diǎn)列表的長(zhǎng)度(即節(jié)點(diǎn)的數(shù)量)。

您可以通過使用 length 屬性來遍歷節(jié)點(diǎn)列表:

實(shí)例

xmlDoc=loadXMLDoc("books.xml");

x=xmlDoc.getElementsByTagName("title");

for (i=0;i<x.length;i++)
{
document.write(x[i].childNodes[0].nodeValue);
document.write("
");
}

嘗試一下 ?

實(shí)例解釋:

  1. 使用 loadXMLDoc() 把 "books.xml" 載入 xmlDoc 中
  2. 獲取所有 <title> 元素節(jié)點(diǎn)
  3. 輸出每個(gè) <title> 元素的文本節(jié)點(diǎn)的值

節(jié)點(diǎn)類型(Node Types)

XML 文檔的 documentElement 屬性石根節(jié)點(diǎn)。

節(jié)點(diǎn)的 nodeName 屬性是節(jié)點(diǎn)的名稱。

節(jié)點(diǎn)的 nodeType 屬性是節(jié)點(diǎn)的類型。

您將在本教程的下一章中學(xué)習(xí)更多有關(guān)節(jié)點(diǎn)屬性的知識(shí)。

嘗試一下


遍歷節(jié)點(diǎn)

下面的代碼遍歷根節(jié)點(diǎn)的子節(jié)點(diǎn),同時(shí)也是元素節(jié)點(diǎn):

實(shí)例

xmlDoc=loadXMLDoc("books.xml");

x=xmlDoc.documentElement.childNodes;

for (i=0;i<x.length;i++)
{
if (x[i].nodeType==1)
{//Process only element nodes (type 1)
document.write(x[i].nodeName);
document.write("
");
}
}

嘗試一下 ?

實(shí)例解釋:

  1. 使用 loadXMLDoc() 把 "books.xml" 載入 xmlDoc 中
  2. 獲取根元素的子節(jié)點(diǎn)
  3. 檢查每個(gè)子節(jié)點(diǎn)的節(jié)點(diǎn)類型。如果節(jié)點(diǎn)類型是 "1",則是元素節(jié)點(diǎn)
  4. 如果是元素節(jié)點(diǎn),則輸出節(jié)點(diǎn)的名稱

導(dǎo)航節(jié)點(diǎn)的關(guān)系

下面的代碼使用節(jié)點(diǎn)關(guān)系導(dǎo)航節(jié)點(diǎn)樹:

實(shí)例

xmlDoc=loadXMLDoc("books.xml");

x=xmlDoc.getElementsByTagName("book")[0].childNodes;
y=xmlDoc.getElementsByTagName("book")[0].firstChild;

for (i=0;i<x.length;i++)
{
if (y.nodeType==1)
{//Process only element nodes (type 1)
document.write(y.nodeName + "
");
}
y=y.nextSibling;
}

嘗試一下 ?
  1. 使用 loadXMLDoc() 把 "books.xml" 載入 xmlDoc 中
  2. 獲取第一個(gè) book 元素的子節(jié)點(diǎn)
  3. 把 "y" 變量設(shè)置為第一個(gè) book 元素的第一個(gè)子節(jié)點(diǎn)
  4. 對(duì)于每個(gè)子節(jié)點(diǎn)(第一個(gè)子節(jié)點(diǎn)從 "y" 開始),檢查節(jié)點(diǎn)類型,如果節(jié)點(diǎn)類型為 "1",則是元素節(jié)點(diǎn)
  5. 如果是元素節(jié)點(diǎn),則輸出該節(jié)點(diǎn)的名稱
  6. 把 "y" 變量設(shè)置為下一個(gè)同級(jí)節(jié)點(diǎn),并再次運(yùn)行循環(huán)
以上內(nèi)容是否對(duì)您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號(hào)
微信公眾號(hào)

編程獅公眾號(hào)