Esempio XML AJAX
AJAX può essere utilizzato per la comunicazione interattiva con un file XML.
Esempio XML AJAX
L'esempio seguente dimostrerà come una pagina Web può recuperare informazioni da un file XML con AJAX:
Esempio
Esempio spiegato
Quando un utente fa clic sul pulsante "Ottieni informazioni sul CD" in alto, la loadDoc()
funzione viene eseguita.
La loadDoc()
funzione crea un XMLHttpRequest
oggetto, aggiunge la funzione da eseguire quando la risposta del server è pronta e invia la richiesta al server.
Quando la risposta del server è pronta, viene creata una tabella HTML, i nodi (elementi) vengono estratti dal file XML e infine aggiorna l'elemento "demo" con la tabella HTML riempita di dati XML:
function loadDoc() {
const xhttp = new XMLHttpRequest();
xhttp.onload = function() {myFunction(this);}
xhttp.open("GET", "cd_catalog.xml");
xhttp.send();
}
function myFunction(xml) {
const xmlDoc = xml.responseXML;
const x = xmlDoc.getElementsByTagName("CD");
let table="<tr><th>Artist</th><th>Title</th></tr>";
for (let 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;
}
Il file XML
Il file XML utilizzato nell'esempio sopra è simile al seguente: " cd_catalog.xml ".