Pohon Node Lintasan XML DOM
Traversing berarti perulangan melalui atau perjalanan melintasi pohon simpul.
Melintasi Pohon Node
Seringkali Anda ingin mengulang dokumen XML, misalnya: ketika Anda ingin mengekstrak nilai setiap elemen.
Ini disebut "Melintasi pohon simpul"
Contoh di bawah ini mengulang semua node anak <book>, dan menampilkan nama dan nilainya:
Contoh
<!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 always
represents the root node
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>
Keluaran:
title: Everyday Italian
author: Giada De Laurentiis
year: 2005
Contoh menjelaskan:
- Muat string XML ke xmlDoc
- Dapatkan simpul anak dari elemen root
- Untuk setiap simpul anak, keluarkan nama simpul dan nilai simpul dari simpul teks
Perbedaan Browser dalam Parsing DOM
Semua browser modern mendukung spesifikasi DOM W3C.
Namun, ada beberapa perbedaan antara browser. Satu perbedaan penting adalah:
- Cara mereka menangani spasi putih dan baris baru
DOM - Spasi Putih dan Baris Baru
XML sering berisi baris baru, atau karakter spasi putih, di antara node. Ini sering terjadi ketika dokumen diedit oleh editor sederhana seperti Notepad.
Contoh berikut (diedit oleh Notepad) berisi CR/LF (baris baru) antara setiap baris dan dua spasi di depan setiap simpul anak:
<book>
<title>Everyday Italian</title>
<author>Giada De Laurentiis</author>
<year>2005</year>
<price>30.00</price>
</book>
Internet Explorer 9 dan sebelumnya TIDAK memperlakukan spasi kosong, atau baris baru sebagai node teks, sementara browser lain melakukannya.
Contoh berikut akan menampilkan jumlah node anak yang dimiliki elemen root (dari books.xml ). IE9 dan sebelumnya akan menampilkan 4 node anak, sedangkan IE10 dan versi yang lebih baru, dan browser lain akan menampilkan 9 node anak:
Contoh
function myFunction(xml) {
var xmlDoc = xml.responseXML;
x =
xmlDoc.documentElement.childNodes;
document.getElementById("demo").innerHTML =
"Number
of child nodes: " + x.length;
}
PCDATA - Data Karakter yang Diurai
Parser XML biasanya mengurai semua teks dalam dokumen XML.
Saat elemen XML diuraikan, teks di antara tag XML juga diuraikan:
<message>This text is also parsed</message>Parser melakukan ini karena elemen XML dapat berisi elemen lain, seperti dalam contoh ini, di mana elemen <name> berisi dua elemen lain (pertama dan terakhir):
<name><first>Bill</first><last>Gates</last></name>dan parser akan memecahnya menjadi sub-elemen seperti ini:
<name>
<first>Bill</first>
<last>Gates</last>
</name>Data Karakter Parsing (PCDATA) adalah istilah yang digunakan tentang data teks yang akan diurai oleh parser XML.
CDATA - Data Karakter (Belum Diurai)
Istilah CDATA digunakan tentang data teks yang tidak boleh diuraikan oleh parser XML.
Karakter seperti "<" dan "&" ilegal dalam elemen XML.
"<" akan menghasilkan kesalahan karena parser menafsirkannya sebagai awal dari elemen baru.
"&" akan menghasilkan kesalahan karena parser menafsirkannya sebagai awal entitas karakter.
Beberapa teks, seperti kode JavaScript, berisi banyak karakter "<" atau "&". Untuk menghindari kesalahan kode script dapat didefinisikan sebagai CDATA.
Segala sesuatu di dalam bagian CDATA diabaikan oleh parser.
Bagian CDATA dimulai dengan " <![CDATA[ " dan diakhiri dengan " ]]> ":
<script>
<![CDATA[
function matchwo(a,b)
{
if (a < b && a < 0)
{
return 1;
} else
{
return 0;
}
}
]]>
</script>Pada contoh di atas, semua yang ada di dalam bagian CDATA diabaikan oleh parser.
Catatan tentang bagian CDATA:
Bagian CDATA tidak boleh berisi string "]]>". Bagian CDATA bertingkat tidak diperbolehkan.
"]]>" yang menandai akhir bagian CDATA tidak boleh berisi spasi atau jeda baris.