AJAX Ejemplo XML


AJAX se puede utilizar para comunicarse interactivamente con archivos XML.


Ejemplo de AJAX XML

El siguiente ejemplo demuestra cómo una página web utiliza AJAX para leer información de un archivo XML:

Ejemplo




Pruébalo »


Análisis del ejemplo - Función loadXMLDoc()

Cuando el usuario hace clic en el botón "Obtener mis CD favoritos" de arriba, se ejecuta la función loadXMLDoc().

La función loadXMLDoc() crea un objeto XMLHttpRequest, agrega una función que se ejecuta cuando la respuesta del servidor está lista y envía la solicitud al servidor.

Cuando la respuesta del servidor está lista, se construye una tabla HTML, se extraen nodos (elementos) del archivo XML y, finalmente, se utilizan los datos XML para rellenar el elemento con id="demo":

Carga asíncrona de documentos XML

function loadXMLDoc() { var xhttp = new XMLHttpRequest(); xhttp.onreadystatechange = function() { if (this.readyState == 4 && this.status == 200) { myFunction(this); } }; 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; }


Página de servidor AJAX

La página de servidor utilizada en el ejemplo anterior es en realidad un archivo llamado "" archivo XML.

Otras extensiones