I started to learn Ajax today. And I tried to do some practices by following step by step how to use AJAX but unfortunaly it's not working and I dont know where's the problem since I don't get any warning in console.log.
I have an example.xml in my root folder that i try to get data from.
Here's what I did. Thanks!
function getXMLHttpRequest(){
var xhr = null;
if(window.XMLHttpRequest || window.ActiveXObject){
if(window.ActiveXobject){
try{
xhr = new ActiveXobject("Msxml2.XMLHTTP");
}catch(e){
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
}else{
xhr = new XMLHttpRequest();
}
}else{
alert("Votre navigateur ne supporte pas l'objet XMLHttpRequest");
}
return xhr;
}
function request(callback){
var xhr = getXMLHttpRequest();
xhr.onreadystatechange = function(){
if(xhr.readyStae == 4 && (xhr.status == 200 || xhr.status == 0)){
callback(xhr.responseXML);
}
}
xhr.open("GET", "example.xml", true);
xhr.send(null);
}
function readData(oData){
var node = oData.getElementsByTagName("soft");
var ul = document.createElement("ul");
var li, content;
for(let i = 0; i < node.length; i++){
li = document.createElement("li");
content = document.createTextNode(node[i].getAttribute("name"));
li.appendChild(content);
ul.appendChild(li);
}
document.getElementById("output").appendChild(ul);
}<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>ajax</title>
</head>
<body>
<p>
<button onclick="request(readData);">Afficher les données</button>
</p>
<div id="output">
</div>
</body>
</html></div>
