cittadino_XML.html

<h1>Risultati</h1>
<button onclick="GetData();">Premi qui</button>
<p id="nome"></p>

<script>
function getNodeValue(obj,tag)
{
        return obj.getElementsByTagName(tag)[0].firstChild.nodeValue;
}

function GetData() {
    var xhr;
    if (window.XMLHttpRequest)
        xhr = new XMLHttpRequest();
    else if (window.ActiveXObject)
        xhr = new ActiveXObject("Msxml2.XMLHTTP");
    else
        throw new Error("Ajax non è supportato dal browser");
    xhr.onreadystatechange = function () {
        if (xhr.readyState < 4)
            document.getElementById('div1').innerHTML = "Loading...";
        else if (xhr.readyState === 4) {
            if (xhr.status == 200 && xhr.status < 300) {
         response = xhr.responseXML;
         var cittadino = response.getElementsByTagName('cittadino')[0];
         var nome=getNodeValue(cittadino,'nome');
             var famiglia = response.getElementsByTagName('famiglia');

                 document.getElementById('nome').innerHTML="Nome: "+nome;

                 for (var i=0;i<famiglia.length;i++) {
                 var node = document.createElement("p");
                 var textnode = document.createTextNode("Famigliare "+(i+1)+": "+famiglia[i].firstChild.nodeValue);
                 node.appendChild(textnode);
                 document.getElementById("nome").appendChild(node);
                     }
                 }

        }
    }
    xhr.open('GET', 'cittadino.xml');
    xhr.send(null);
}

</script>