<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>JavaScript AJAX</title>
</head>
<body>
<h1>AJAX page</h1>
<div id="update"></div>
<script src="script.js"></script>
</body>
</html>
var xhr;
if (window.XMLHttpRequest) {
xhr = new XMLHttpRequest();
} else {
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
xhr.open('GET', 'data.xml');
xhr.onreadystatechange = function() {
if((xhr.readyState === 4) && (xhr.status === 200)) {
console.log(xhr.responseXML.getElementsByTagName("name")[1]);
console.log(xhr.responseXML.getElementsByTagName("name")[1].childNodes[0]);
console.log(xhr.responseXML.getElementsByTagName("name")[1].firstChild.nodeValue);
var names = xhr.responseXML.getElementsByTagName("name");
var output = "<ul>";
for(var i = 0; i < names.length; ++i){
output += "<li>" + names[i].firstChild.nodeValue + "</li>";
}
output += "</ul>";
document.getElementById("update").innerHTML = output;
}
}
xhr.send();
So every element inside an XML structure is considered a node. Elements inside other elements, including the text inside an element, is also considered a node.
JSON
var request;
if (window.XMLHttpRequest) {
request = new XMLHttpRequest();
} else {
request = new ActiveXObject("Microsoft.XMLHTTP");
}
request.open('GET', 'data.json');
request.onreadystatechange = function() {
if ((request.readyState===4) && (request.status===200)) {
var items = JSON.parse(request.responseText);
var output = '<ul>';
for (var key in items) {
output += '<li>' + items[key].name + '</li>';
}
output += '</ul>';
document.getElementById('update').innerHTML = output;
}
}
request.send();
