AJAX สามารถใช้เพื่อสื่อสารแบบโต้ตอบกับไฟล์ XML
ตัวอย่างต่อไปนี้จะสาธิตวิธีที่หน้าเว็บอ่านข้อมูลจากไฟล์ XML ผ่าน AJAX:
เมื่อผู้ใช้เลือกซีดีในรายการดรอปดาวน์ด้านบน ฟังก์ชันชื่อ "showCD()" จะถูกดำเนินการ ฟังก์ชั่นนี้ถูกทริกเกอร์โดยเหตุการณ์ "onchange":
<html><head><script>function showCD(str){ if (str=="") { document.getElementById("txtHint").innerHTML=""; return; } ถ้า (window.XMLHttpRequest) { // เบราว์เซอร์ IE7+, Firefox, Chrome, Opera, Safari รัน xmlhttp=new XMLHttpRequest(); } else { // IE6, IE5 เบราว์เซอร์ดำเนินการ xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange=function() { if (xmlhttp.readyState==4 && xmlhttp.status==200) { document.getElementById("txtHint") innerHTML=xmlhttp.responseText; xmlhttp.open("GET", "getcd.php?q="+str,true); xmlhttp.send();}</script></head><body><form>เลือกซีดี:<เลือกชื่อ ="cds" onchange="showCD(this.value)"><option value="">เลือกซีดี:</option><option value="Bob Dylan">Bob Dylan</option><option value=" บอนนี่ ไทเลอร์">บอนนี่ Tyler</option><option value="Dolly Parton">Dolly Parton</option></select></form><div id="txtHint"><b>ข้อมูลซีดีจะแสดงอยู่ที่นี่...</ b></div></body></html>ฟังก์ชัน showCD() ดำเนินการตามขั้นตอนต่อไปนี้:
ตรวจสอบว่าได้เลือกซีดีหรือไม่
สร้างวัตถุ XMLHttpRequest
สร้างฟังก์ชันที่ดำเนินการเมื่อการตอบสนองของเซิร์ฟเวอร์พร้อม
ส่งคำขอไปยังไฟล์บนเซิร์ฟเวอร์
โปรดทราบว่าพารามิเตอร์ (q) ถูกเพิ่มต่อท้าย URL (ประกอบด้วยเนื้อหาของรายการแบบเลื่อนลง)
หน้าเซิร์ฟเวอร์ที่เรียกข้างต้นผ่าน JavaScript เป็นไฟล์ PHP ชื่อ "getcd.php"
สคริปต์ PHP โหลดเอกสาร XML "cd_catalog.xml" เรียกใช้แบบสอบถามกับไฟล์ XML และส่งกลับผลลัพธ์ในรูปแบบ HTML:
<?php$q=$_GET["q"];$xmlDoc = new DOMDocument();$xmlDoc->load("cd_catalog.xml");$x=$xmlDoc->getElementsByTagName('ARTIST');สำหรับ ($i=0; $i<=$x->length-1; $i++){/ // ประมวลผลโหนดองค์ประกอบถ้า ($x->item($i)->nodeType==1) { if ($x->item($i)->childNodes->item(0)->nodeValue == $q) { $y= ($x->item($i)->parentNode); } }}$cd=($y->childNodes);สำหรับ ($i=0;$i<$cd->ความยาว;$i++){ // ประมวลผลโหนดองค์ประกอบ if ($cd->item($i)->nodeType==1) { echo("<b>" . $cd->item($i)->nodeName . ":</b > "); echo($cd->item($i)->childNodes->item(0)->nodeValue); echo("<br>"); }}?>เมื่อแบบสอบถามซีดีถูกส่งจาก JavaScript ไปยังหน้า PHP จะเกิดอะไรขึ้น:
PHP สร้างวัตถุ XML DOM
ค้นหาชื่อในองค์ประกอบ <artist> ทั้งหมดที่ตรงกับข้อมูลที่ส่งผ่านโดย JavaScript
ส่งออกข้อมูลอัลบั้มและส่งตัวยึดตำแหน่ง "txtHint" กลับมา