Pemeliharaan DOM XML mengelilingi pohon node

Mengelilingi (Traverse) berarti mengelilingi pohon node.

Mengelilingi pohon node

Anda sering kali memerlukan mengelilingi dokumen XML, seperti: ketika Anda ingin mengekstrak nilai setiap elemen.

Proses ini disebut "mengelilingi pohon node

Contoh di bawah ini mengelilingi semua node anak <book> dan menampilkan namanya dan nilai nya:

Contoh

<!DOCTYPE html>
<html>
<body>
<p id="demo"></p>
<script>
var x, i ,xmlDoc;
var txt = "";
var text = "<book>" +
"<title>雅舍谈吃</title>" +
"<author>梁实秋</author>" +
"<year>2013</year>" +
"</book>";
parser = new DOMParser();
xmlDoc = parser.parseFromString(text,"text/xml");
// documentElement selalu mewakili node root
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>

Coba sendiri

Penjelasan contoh:

  1. Muat string XML ke xmlDoc di
  2. Ambil node anak root element
  3. Output nama setiap node anak, serta nilai node teksnya

Perbedaan di antara browser dalam analisis DOM

Seluruh browser modern mendukung standar W3C DOM.

Namun, ada beberapa perbedaan di antara browser.

Cara mereka menangani spasi dan baris baru

DOM - Spasi dan Baris Baru

XML biasanya mengandung spasi atau karakter kosong di antara node. Kapan saja saat mengedit dokumen dengan editor sederhana seperti Notepad, biasanya terjadi hal ini.

Contoh di bawah ini (diedit dengan Notepad) mengandung CR/LF (simbol baris baru) di antara setiap baris, dan ada 2 spasi di depan setiap node anak:

<book>
  <title>雅舍谈吃</title>
  <author>梁实秋</author>
  <press>江苏文艺出版社</press>
  <year>2013</year>
  <price>35</price>
  <ISBN>9787539962771</ISBN>
</book>

Internet Explorer 9 dan versi sebelumnya tidak akan menganggap spasi atau baris baru sebagai node teks, sedangkan browser lainnya akan melakukan hal ini.

Contoh di bawah ini akan menampilkan jumlah node anak yang dimiliki elemen root (books.xml). Versi IE9 dan sebelumnya akan menampilkan 6 node anak, sedangkan versi IE10 dan setelahnya serta browser lainnya akan menampilkan 9 node anak:

Contoh

function myFunction(xml) {
var xmlDoc = xml.responseXML;
    x = xmlDoc.documentElement.childNodes;
    document.getElementById("demo").innerHTML =
    "Jumlah anak node: " + x.length;
}

Coba sendiri

PCDATA - Data Karakter yang Diurai (Parsed Character Data)

Pengeompal XML biasanya akan meraih semua teks di dalam dokumen XML.

Pada saat mengurai elemen XML, teks antara tanda penanda XML juga akan diurai:

<message>Teks ini juga akan diurai</message>

Pengeompal melakukan hal ini karena elemen XML dapat mengandung elemen lain, seperti contoh ini, di mana elemen <name> mengandung elemen lainnya (first dan last):

<name><first>Bill</first><last>Gates</last></name>

Pengeompal akan memecahkannya menjadi elemen anak berikut:

<name>
  <first>Bill</first>
  <last>Gates</last>
</name>

“Data Karakter yang Diurai” (PCDATA) adalah istilah yang digunakan untuk mendeskripsikan teks data yang akan diurai oleh pengeompal XML.

CDATA - Data Karakter Tidak Diurai (Unparsed Character Data)

Termin CDATA digunakan untuk mendeskripsikan teks data yang tidak seharusnya diurai oleh pengeompal XML.

"<" dan "&" karakter seperti ini adalah ilegal di dalam elemen XML.

"<" akan memicu kesalahan, karena pengeompal menginterpretasikannya sebagai awal elemen baru.

"&" akan memicu kesalahan, karena pengeompal menginterpretasikannya sebagai awal karakter entity.

Beberapa teks (seperti kode JavaScript) mengandung banyak "<" atau "&" karakter. Agar menghindari kesalahan, kode skrip dapat ditandai sebagai CDATA.

Semua konten di dalam bagian CDATA akan diabaikan oleh pengeompal.

Bagian CDATA dengan "<![CDATA[" Mulai, dengan "]]>" Penutup:

<script>
<![CDATA[
function matchwo(a,b) {
    if (a < b && a < 0) {
        return 1;
    else {
        kembalikan 0;
    }
}
]]>
</script>

在上面的示例中，解析器会忽略 CDATA 部分内的所有内容。

关于 CDATA 部分的注意事项：

CDATA 部分不能包含字符串 "]]>"。不允许嵌套 CDATA 部分。

标记 CDATA 部分结尾的 "]]>" 不能包含空格或换行符。