Contoh XML AJAX

AJAX dapat digunakan untuk berkomunikasi interaktif dengan berkas XML.

Contoh XML AJAX

Contoh di bawah ini menunjukkan bagaimana halaman web dapat membaca informasi dari berkas XML melalui AJAX:

Contoh

Coba sendiri

Pengertian contoh

Ketika pengguna mengklik tombol 'Ambil Informasi CD', eksekusi fungsi loadDoc().

Fungsi loadDoc() membuat objek XMLHttpRequest, menambahkan fungsi yang akan dieksekusi saat server siap merespon, dan mengirim permintaan ke server.

Ketika server siap merespon, buat tabel HTML, ekstrak node (faktor) dari berkas XML, dan akhirnya update elemen 'demo' dengan tabel HTML yang diisi data XML:

LoadXMLDoc()

function loadDoc() {
  var xhttp = new XMLHttpRequest();
   xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
    myFunction(this);
     }
  };
  xhttp.open("GET", "music_list.xml", true);
  xhttp.send();
}
function myFunction(xml) {
  var i;
  var xmlDoc = xml.responseXML;
  var table="<tr><th>Artis</th><th>Track</th></tr>";
  var x = xmlDoc.getElementsByTagName("TRACK");
  for (i = 0; i <x.length;  i++) { 
    table += "<tr><td>" +
    x[i].getElementsByTagName("ARTIST")[0].childNodes[0].nodeValue  +
    "</td><td>" +
    x[i].getElementsByTagName("TITLE")[0].childNodes[0].nodeValue  +
    "</td></tr>";
  }
   document.getElementById("demo").innerHTML = table;
}

File XML

File XML yang digunakan di contoh sebelumnya seperti ini: "music_list.xml"。