مثال AJAX XML

AJAX می‌تواند برای ارتباط تعاملی با فایل XML استفاده شود.

مثال AJAX XML

در مثال زیر، نحوه‌ی خواندن اطلاعات از فایل XML توسط webpage از طریق AJAX نشان داده شده است:

مثال

سعی کنید خودتان امتحان کنید

توضیح مثال

وقتی کاربر بر روی دکمه "اطلاعات CD را دریافت کنید" کلیک می‌کند، تابع loadDoc() اجرا می‌شود.

تابع loadDoc() یک شیء XMLHttpRequest ایجاد می‌کند، یک تابع را اضافه می‌کند که هنگام آماده‌شدن پاسخ سرور اجرا می‌شود و درخواست را به سرور ارسال می‌کند.

وقتی سرور پاسخ داد، یک جدول HTML ایجاد کنید، گره‌ها (عناصر) را از فایل XML استخراج کنید و در نهایت با استفاده از جدول HTML پر شده با داده‌های XML، عنصر "demo" را به‌روزرسانی کنید:

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>هنرمند</th><th>آهنگ</th></tr>";
  var x = xmlDoc.getElementsByTagName("TRACK");
  برای (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;
} 

فایل XML

در مثال قبلی از فایل XML مشابه این استفاده شده است:"music_list.xml".