Ejemplo de AJAX XML

AJAX se puede usar para comunicaciones interactivas con archivos XML.

Ejemplo de AJAX XML

El siguiente ejemplo muestra cómo una página web puede leer información de un archivo XML mediante AJAX:

Ejemplo

Prueba por tu cuenta

Ejemplo de explicación

Cuando el usuario hace clic en el botón "Obtener información de CD", se ejecuta la función loadDoc().

La función loadDoc() crea un objeto XMLHttpRequest, agrega una función a ejecutar cuando el servidor esté listo para responder y envía una solicitud al servidor.

Después de que el servidor esté listo para responder, construye una tabla HTML, extrae nodos (elementos) del archivo XML y finalmente actualiza el elemento "demo" con una tabla HTML llenada con datos XML:

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>Artista</th><th>Track</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;
}

Archivo XML

El archivo XML utilizado en el ejemplo anterior es similar a este: "music_list.xml"。