Contoh XML AJAX
AJAX dapat digunakan untuk komunikasi interaktif dengan file XML.
Contoh XML AJAX
Contoh berikut akan menunjukkan bagaimana halaman web dapat mengambil informasi dari file XML dengan AJAX:
Contoh
Contoh Dijelaskan
Saat pengguna mengklik tombol "Dapatkan info CD" di atas, fungsi loadDoc() dijalankan.
Fungsi loadDoc() membuat objek XMLHttpRequest, menambahkan fungsi yang akan dieksekusi saat respons server siap, dan mengirimkan permintaan ke server.
Ketika respons server siap, tabel HTML dibuat, node (elemen) diekstraksi dari file XML, dan akhirnya memperbarui elemen "demo" dengan tabel HTML yang diisi dengan data XML:
MuatXMLDoc ()
function loadDoc() {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState
== 4 && this.status == 200) {
myFunction(this);
}
};
xhttp.open("GET", "cd_catalog.xml", true);
xhttp.send();
}
function myFunction(xml) {
var i;
var xmlDoc = xml.responseXML;
var table="<tr><th>Title</th><th>Artist</th></tr>";
var x = xmlDoc.getElementsByTagName("CD");
for (i = 0; i <x.length;
i++) {
table += "<tr><td>" +
x[i].getElementsByTagName("TITLE")[0].childNodes[0].nodeValue
+
"</td><td>" +
x[i].getElementsByTagName("ARTIST")[0].childNodes[0].nodeValue
+
"</td></tr>";
}
document.getElementById("demo").innerHTML = table;
}
File XML
File XML yang digunakan dalam contoh di atas terlihat seperti ini: " cd_catalog.xml ".