Exemple XML AJAX
AJAX peut être utilisé pour une communication interactive avec un fichier XML.
Exemple XML AJAX
L'exemple suivant montre comment une page Web peut récupérer des informations à partir d'un fichier XML avec AJAX :
Exemple
Exemple expliqué
Lorsqu'un utilisateur clique sur le bouton "Get CD info" ci-dessus, la fonction loadDoc() est exécutée.
La fonction loadDoc() crée un objet XMLHttpRequest, ajoute la fonction à exécuter lorsque la réponse du serveur est prête et envoie la requête au serveur.
Lorsque la réponse du serveur est prête, un tableau HTML est construit, les nœuds (éléments) sont extraits du fichier XML, et il met enfin à jour l'élément "demo" avec le tableau HTML rempli de données XML :
ChargerXMLDoc ()
function loadDoc() {
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>Title</th><th>Artist</th></tr>";
var x = xmlDoc.getElementsByTagName("CD");
for (i = 0; i <x.length;
i++) {
table += "<tr><td>" +
x[i].getElementsByTagName("TITLE")[0].childNodes[0].nodeValue
+
"</td><td>" +
x[i].getElementsByTagName("ARTIST")[0].childNodes[0].nodeValue
+
"</td></tr>";
}
document.getElementById("demo").innerHTML = table;
}
Le fichier XML
Le fichier XML utilisé dans l'exemple ci-dessus ressemble à ceci : " cd_catalog.xml ".