TUTORIEL AJAX - Utiliser la réponse au format XML

Description

Dans cette page, la requête AJAX ramène un document XML.
Pour exploiter son contenu, nous aurons besoin

La mise en forme sera effectué par la fonction javascript.

Fonctionnement
Lancer la requête en cliquant ici
C'est ici que s'affichera le résultat de la requete
Le document XML
<?xml version="1.0" encoding="utf-8"?>
<personnes>
        <personne>
                <civ>Mme</civ>
                <prenom>Amélie</prenom>
                <nom>DEVIN</nom>
                <poste>350</poste>
        </personne>
        <personne>
                <civ>M.</civ>
                <prenom>Alex</prenom>
                <nom>ANDRY</nom>
                <poste>601</poste>
        </personne>
        <personne>
                <civ>Mle</civ>
                <prenom>Eléonore</prenom>
                <nom>PAZALWEST</nom>
                <poste>212</poste>
        </personne>
</personnes>
Le code Javascript
function go() {
        var xhr = getXhr();
        xhr.onreadystatechange = function(){
        if(xhr.readyState == 4 && xhr.status == 200){
                // cette partie est spécifique au traitement des réponses XML
                response = xhr.responseXML;
                // récupérer dans un tableau la liste des personnes
                var items = response.getElementsByTagName("personne"); // renvoie 
                un tableau d'éléments XML "personne"
                var html = ''; // stockage du code HTML à afficher
                nb = items.length; // nombre de personnes ramenées
                for (i=0; i<nb; i++) {
                        // pour chaque personne
                        html += '<h2>Personne</h2>';
                        html += items[i].getElementsByTagName("civ")[0].firstChild.nodeValue+' ';
                        html += items[i].getElementsByTagName("prenom")[0].firstChild.nodeValue+' ';
                        html += items[i].getElementsByTagName("nom")[0].firstChild.nodeValue+'<br />';
                        html += 'Poste : '+items[i].getElementsByTagName("poste")[0].firstChild.nodeValue+'<hr />';
                }
                document.getElementById("here").innerHTML = html;
                }
        }
        xhr.open("GET","gens.xml",true);
        xhr.send(null);
}