AJAX XML 实例

Maaaring gamitin ang AJAX para sa interactive communication sa XML file.

AJAX XML 实例

Ang mga sumusunod na egemplo ay nagpapakita kung paano magbasa ang web page ng impormasyon mula sa XML file gamit ang AJAX:

Egemplo

Subukan nang sarili

Exemplo na nagpapaliwanag

Kapag pinindot ng user ang button na "Get CD Information", ipapakita ang loadDoc() function.

loadDoc() function ay gumawa ng XMLHttpRequest object, nagdagdag ng function na gagawin kapag nakatugon ang server, at nagpadala ng request sa server.

Kapag nakatapos na tumugon ang server, gumawa ng HTML table, kinuha ang mga node (factors) mula sa XML file, at huli sa pagsasauli ng HTML table na pinupunan ng XML data sa elemento "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");
  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 文件类似这样："music_list.xml"。