[AJAX] xml Ajax

Bonjour, je suis un débutant dans le domaine et j'essaye pour la première fois de faire du ajax et il y un problème dans mon code que je ne comprend pas

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>Test XML</title>
</head>
<body>

<script type="text/javascript">
    var response;
    function getXmlHttpRequest() {
        if (window.XMLHttpRequest) {
            return new XMLHttpRequest();
        }
        else if (window.ActiveXObject) {
            try {
                return new ActiveXObject("Msxml2.XMLHTTP");
            } catch (e) {
                try {
                    return new ActiveXObject("Microsoft.XMLHTTP");
                } catch (E) {
                    return null;
                }
            } 
        }
        else {
            return null;
        }
    }

    var xhr = getXmlHttpRequest();
    xhr.onreadystatechange = handleHttpResponse;

    
 
    var url="personne.xml";
    
    xhr.open("GET", url, true);
    
  
    
    function handleHttpResponse() {
    if(xhr.readyState == 4 && xhr.status == 200) {
        response     = cleanXML(xhr.responseXML.documentElement);
        // ...
       
    }
    return response;
}
    
    var personnes = response.getElementsByTagName("personne");
    var html = "";
    
    var nbPersonne = personnes.lenth;
   
    for(i = 0; i < nbPersonne; i++) { /* POUR CHAQUE personne */
        html += '<div class="personne">';
        html += '<h1>' + persones[i].getElementsByTagName("nom")[0].firstChild.nodeValue + '</h1>';
        html += '<div class="sexe">Sexe : ';
        html += persones[i].getElementsByTagName("sexe")[0].firstChild.nodeValue + '</div>';
        html += '<div class="age">Age : ';
        html += persones[i].getElementsByTagName("age")[0].firstChild.nodeValue + '</div>';
        html += '</div>';
        
    }
    
    document.getElementById('content').innerHTML += html;
    document.write("7");

</script>

</body>
</html>

lorsque j'exécute le problème se situe au response afficher en rouge dans le code. IE me dit que response est null ou n'est pas un objet c'est comme si l'instruction: xhr.onreadystatechange = handleHttpResponse;(en bleu) ne s'exécute

Est-ce que quelqu'un peux m'aider

Merci

Ben oui, ton script s'execute au chargement de la page (ce ne sont pas des fonctions appelées) donc, quand il arrive à l'instruction

Code:

xhr.onreadystatechange = handleHttpResponse;

la fonction handleHttpResponse n'existe pas encore car tu ne la déclare qu'après. Donc js te renvoie une erreur...

EDIT :
Essaye

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
<script type="text/javascript">
    var response;
    function getXmlHttpRequest() {
        if (window.XMLHttpRequest) {
            return new XMLHttpRequest();
        }
        else if (window.ActiveXObject) {
            try {
                return new ActiveXObject("Msxml2.XMLHTTP");
            } catch (e) {
                try {
                    return new ActiveXObject("Microsoft.XMLHTTP");
                } catch (E) {
                    return null;
                }
            } 
        }
        else {
            return null;
        }
    }
    function handleHttpResponse() {
    if(xhr.readyState == 4 && xhr.status == 200) {
        response     = cleanXML(xhr.responseXML.documentElement);
        // ...
 
    }
    return response;
}
 
    var xhr = getXmlHttpRequest();
    xhr.onreadystatechange = handleHttpResponse;
 
 
 
    var url="personne.xml";
 
    xhr.open("GET", url, true);
 
 
 
 
    var personnes = response.getElementsByTagName("personne");
    var html = "";
 
    var nbPersonne = personnes.lenth;
 
    for(i = 0; i < nbPersonne; i++) { /* POUR CHAQUE personne */
        html += '<div class="personne">';
        html += '<h1>' + persones[i].getElementsByTagName("nom")[0].firstChild.nodeValue + '</h1>';
        html += '<div class="sexe">Sexe : ';
        html += persones[i].getElementsByTagName("sexe")[0].firstChild.nodeValue + '</div>';
        html += '<div class="age">Age : ';
        html += persones[i].getElementsByTagName("age")[0].firstChild.nodeValue + '</div>';
        html += '</div>';
 
    }
 
    document.getElementById('content').innerHTML += html;
    // document.write("7");   Cette ligne ne sert à rien...
 
</script>

Merci beaucoup ;)