XML DOM 遍歷節點樹
遍歷是指迴圈或跨越節點樹。
遍歷節點樹
通常，你希望迴圈遍歷 XML 文件，例如：當你想要提取每個元素的值時。
這被稱為“遍歷節點樹”
下面的示例迴圈遍歷 <book> 的所有子節點，並顯示它們的名稱和值。
示例
<!DOCTYPE html>
<html>
<body>
<p id="demo"></p>
<script>
var x, i ,xmlDoc;
var txt = "";
var text = "<book>" +
"<title>Everyday Italian</title>" +
"<author>Giada De Laurentiis</author>" +
"<year>2005</year>" +
"</book>";
parser = new DOMParser();
xmlDoc = parser.parseFromString(text,"text/xml");
// documentElement 始終代表根節點
x = xmlDoc.documentElement.childNodes;
for (i = 0; i < x.length ;i++) {
txt += x[i].nodeName + ": " + x[i].childNodes[0].nodeValue + "<br>";
}
document.getElementById("demo").innerHTML = txt;
</script>
</body>
</html>
輸出
title: Everyday Italian
author: Giada De Laurentiis
year: 2005
自己動手試一試 »
示例說明
- 將 XML 字串載入到 xmlDoc 中
- 獲取根元素的子節點
- 對於每個子節點，輸出節點名稱和文字節點的節點值
DOM 解析中的瀏覽器差異
所有現代瀏覽器都支援 W3C DOM 規範。
但是，瀏覽器之間存在一些差異。一個重要的區別是
- 它們處理空白字元和換行的方式
DOM - 空白字元和換行
XML 中節點之間的換行符或空白字元很常見。當文件由像記事本這樣的簡單編輯器編輯時，這種情況經常發生。
下面的示例（由記事本編輯）在每行之間包含 CR/LF（換行符），並在每個子節點前面有兩個空格。
<book>
<title>Everyday Italian</title>
<author>Giada De Laurentiis</author>
<year>2005</year>
<price>30.00</price>
</book>Internet Explorer 9 及更早版本不將空空白字元或換行符視為文字節點，而其他瀏覽器則會。
下面的示例將輸出根元素（來自 books.xml）的子節點數量。IE9 及更早版本將輸出 4 個子節點，而 IE10 及更高版本以及其他瀏覽器將輸出 9 個子節點。
示例
function myFunction(xml) {
var xmlDoc = xml.responseXML;
x = xmlDoc.documentElement.childNodes;
document.getElementById("demo").innerHTML =
"子節點數量: " + x.length;
}
自己動手試一試 »
PCDATA - 已解析字元資料
XML 解析器通常會解析 XML 文件中的所有文字。
當解析 XML 元素時，XML 標籤之間的文字也會被解析。
<message>這段文字也會被解析</message>解析器之所以這樣做，是因為 XML 元素可以包含其他元素，如本例所示，其中 <name> 元素包含兩個其他元素（first 和 last）。
<name><first>Bill</first><last>Gates</last></name>然後解析器會將其分解為如下子元素：
<name>
<first>Bill</first>
<last>Gates</last>
</name>已解析字元資料 (PCDATA) 是一個用於描述將被 XML 解析器解析的文字資料的術語。
CDATA - （未解析）字元資料
CDATA 一詞用於描述不應被 XML 解析器解析的文字資料。
像 "<" 和 "&" 這樣的字元在 XML 元素中是非法的。
"<" 會產生錯誤，因為解析器將其解釋為新元素的開始。
"&" 會產生錯誤，因為解析器將其解釋為字元實體的開始。
某些文字，如 JavaScript 程式碼，包含很多 "<" 或 "&" 字元。為避免錯誤，指令碼程式碼可以定義為 CDATA。
CDATA 部分內的所有內容都會被解析器忽略。
CDATA 部分以 "<![CDATA[" 開始，以 "]]>" 結束。
<script>
<![CDATA[
function matchwo(a,b) {
if (a < b && a < 0) {
return 1;
} else {
return 0;
}
}
]]>
</script>在上面的示例中，CDATA 部分內的所有內容都會被解析器忽略。
關於 CDATA 部分的說明
CDATA 部分不能包含字串 "]]>"。不允許巢狀 CDATA 部分。
標記 CDATA 部分結束的 "]]>" 不能包含空格或換行符。
