The example below shows usage of some of the properties explained above.

element.xml

<?xml version='1.0'?>

<root>

    <data>

        <animal>Lion</animal>

            <habitat>jungle</habitat>

            <type>mammal</type>

            <eatingHabit>Carnivore</eatingHabit>

    </data>     

      <data>

        <animal>Deer</animal>

            <habitat>jungle</habitat>

            <type>mammal</type>

            <eatingHabit>Herbivore</eatingHabit>

    </data>

</root>

element.html

<!DOCTYPE html>

<html>

      <body>

            <script>

            function loadFile(name){

                   if (window.XMLHttpRequest)

                   {// code for IE7+, Firefox, Chrome, Opera, Safari

                        xmlhttp = new XMLHttpRequest();

                   }

                   else

                   {// code for IE6, IE5

                        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");

                   }

                  xmlhttp.open("GET",name,false);

                  xmlhttp.send();

                  return xmlhttp.responseXML;

 

            }

           

            xmlDoc = loadFile("element.xml");        

            c = xmlDoc.firstChild;

            if(c.nodeType != 1){

                  while(c.nodeType!=1){

                        c = c.nextSibling;           

                  }

                  document.write(" FirstChild: " + c.nodeName);

            }

            else{

                  document.write(" FirstChild: " + c.nodeName);

            }

           

            c = xmlDoc.getElementsByTagName("animal")[0];

            document.write("<br/> parentNode: " + c.parentNode.nodeName + " value: " + c.parentNode.nodeValue);

           

            document.write("<br/> node name: " + c.nodeName + " value: " + c.childNodes[0].nodeValue);

           

            c = c.nextSibling;

           

            if(c.nodeType != 1){

                  while(c.nodeType!=1){

                        c = c.nextSibling;           

                  }

                  document.write("<br/> nextSibling node name: " + c.nodeName + " value: " + c.childNodes[0].nodeValue);

            }

            else{

                  document.write("<br/> nextSibling node name: " + c.nodeName + " value: " + c.childNodes[0].nodeValue);

            }

           

            document.write("<br/> namespaceURI: " + c.namespaceURI);

           

            c = xmlDoc.lastChild;

            document.write("<br/> LastChild: " + c.nodeName);

           

           

/*          d = xmlDoc.getElementsByTagName("root").childNodes;

            for(j=0; j<d.length; j++){

                  c = d[j].childNodes;

                 

                  for(i=0; i< c.length; i++){

                        if(c[i].nodeType != 3){

                              document.write("NodeName : " + c[i].nodeName);

                              document.write(" NodeType : " + c[i].nodeType);

                              document.write(" NodeValue : " + c[i].childNodes[0].nodeValue);

                              document.write(" Namespace : " + c[i].namespaceURI  + "<br/>");

                        }

                  }

            } */                 

      </script>

      </body>

</html>

Output of the example above:

FirstChild: root
parentNode: data value: null
node name: animal value: Lion
nextSibling node name: habitat value: jungle
namespaceURI: null
LastChild: root