Ultimele tutoriale de dezvoltare web
 

AJAX Exemplul XML


AJAX poate fi utilizat pentru comunicarea interactivă cu un XML fișier.


AJAX XML Example AJAX XML Example

Următorul exemplu va demonstra modul în care o pagină web poate prelua informații dintr-un fișier XML cu Ajax:

Exemplu

Încearcă - l singur »


exemplu explicat

Atunci când un utilizator face clic pe "Get CD info" - loadDoc() "Get CD info" butonul de mai sus, loadDoc() funcția este executată.

loadDoc() funcția creează un XMLHttpRequest obiect, adaugă funcția de a fi executat , atunci când răspunsul server este gata, și trimite cererea de pe la server.

În cazul în care răspunsul server este gata, un tabel HTML este construit, noduri (elements) sunt extrase din fișierul XML, și actualizează în cele din urmă txtCDInfo substituent cu tabelul HTML umplut cu date 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;
}

Fișierul XML

Fișierul XML utilizat în exemplul de mai sus arată astfel: „ cd_catalog.xml “.