Latest web development tutorials

AJAX XML

AJAX dapat digunakan untuk berkomunikasi secara interaktif dengan file XML.

AJAX XML contoh

Contoh berikut menunjukkan bagaimana menggunakan halaman web AJAX untuk membaca informasi dari file XML:

contoh


Coba »

contoh analisis - loadXMLDoc () fungsi

Ketika pengguna mengklik tombol "Mendapatkan informasi CD" akan mengeksekusi loadXMLDoc () fungsi.

loadXMLDoc () fungsi untuk membuat objek XMLHttpRequest, menambahkan fungsi yang akan dijalankan ketika respon dari server siap, dan mengirimkan permintaan ke server.

Ketika respon server sudah siap, akan membangun sebuah tabel HTML, diekstrak simpul (elemen) dari file XML, dan kemudian menggunakan bentuk HTML telah diisi data XML untuk memperbarui txtCDInfo placeholder:

function loadXMLDoc(url)
{
var xmlhttp;
var txt,xx,x,i;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
txt="<table border='1'><tr><th>Title</th><th>Artist</th></tr>";
x=xmlhttp.responseXML.documentElement.getElementsByTagName("CD");
for (i=0;i<x.length;i++)
{
txt=txt + "<tr>";
xx=x[i].getElementsByTagName("TITLE");
{
try
{
txt=txt + "<td>" + xx[0].firstChild.nodeValue + "</td>";
}
catch (er)
{
txt=txt + "<td>&nbsp;</td>";
}
}
xx=x[i].getElementsByTagName("ARTIST");
{
try
{
txt=txt + "<td>" + xx[0].firstChild.nodeValue + "</td>";
}
catch (er)
{
txt=txt + "<td>&nbsp;</td>";
}
}
txt=txt + "</tr>";
}
txt=txt + "</table>";
document.getElementById('txtCDInfo').innerHTML=txt;
}
}
xmlhttp.open("GET",url,true);
xmlhttp.send();
}

server halaman AJAX

Contoh di atas menggunakan server halaman sebenarnya adalah "bernama cd_catalog.xml " file XML.