أحدث البرامج التعليمية وتطوير الشبكة
 

AJAX XML مثال


AJAX يمكن استخدامها للاتصال تفاعلية مع XML الملف.


AJAX XML Example AJAX XML Example

والمثال التالي شرح كيفية صفحة على شبكة الإنترنت يمكن أن تجلب المعلومات من ملف XML مع أجاكس:


وأوضح مثال

عندما ينقر المستخدم على "Get CD info" الزر أعلاه، loadDoc() يتم تنفيذ وظيفة.

و loadDoc() وظيفة يخلق XMLHttpRequest الكائن، يضيف وظيفة ليتم تنفيذها عندما استجابة الملقم جاهزة، ويرسل طلب إيقاف إلى الخادم.

عندما استجابة الملقم جاهزة، يتم بناء جدول HTML، يتم استخراج العقد (عناصر) من ملف XML، ويقوم بتحديث أخيرا txtCDInfo نائبا مع جدول HTML مليئة بيانات XML:

LoadXMLDoc()

function loadDoc() {
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    if (xhttp.readyState == 4 && xhttp.status == 200) {
    myFunction(xhttp);
    }
  };
  xhttp.open("GET", "cd_catalog.xml", true);
  xhttp.send();
}
function myFunction(xml) {
  var i;
  var xmlDoc = xml.responseXML;
  var table="<tr><th>Artist</th><th>Title</th></tr>";
  var x = xmlDoc.getElementsByTagName("CD");
  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;
}

ملف XML

ملف XML المستخدمة في المثال أعلاه يبدو مثل هذا: " cd_catalog.xml ".