Solved: how to display xml data in html

<?xml version ="1.0" encoding = "UTF-8"?>  <employees> <employee id ="1"> <first_name> john </first_name> <last_name> Devon </last_name> <date_of_joining> <day>12</day> <month>1</month> <year>2014</year> </date_of_joining> <department role="the Manager">sales</department> </employee> </employees>

<html> <head> <script> var xmlObject, docObject, name, dateofJoining xmlObject = new XMLHttpRequest(); xmlObject.open("GET","employees.xml",false); xmlObject.send(); docObject = xmlObject.responseXML; name = docObject.getElementByTagName("first_name")[0].childNodes[0].nodeValue; document.write("Name = "+name+ </BR>"); dateofJoining = docObject.getElementByTagName("day")[0].childNodes[0].nodeValue; dateofJoining = dateofJoining +"/"+docObject.getElementByTagName("month")[0].childNodes[0].nodeValue; dateofJoining = dateofJoining +"/"+docObject.getElementByTagName("year")[0].childNodes[0].nodeValue; document.write("DateofJoining= "+dateofJoining+"<BR/>"); </script> </head> <body> </body> </html>

There are too many problems with your code so I have created a demo from the code on this page: http://www.w3schools.com/ajax/ajax_xmlhttprequest_response.asp

JS-XML2.html

<!DOCTYPE html>
<html>
<body>

<h2>My Employees:</h2>

<button type="button" onclick="loadDoc()">Get My Employees</button>

<p id="demo"></p>
 
<script>
function loadDoc() {
  var xhttp, xmlDoc, txt, x, i;
  xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
  if (xhttp.readyState == 4 && xhttp.status == 200) {
    xmlDoc = xhttp.responseXML;
    txt = "";
    x = xmlDoc.getElementsByTagName("first_name");
    for (i = 0; i < x.length; i++) {
      txt = txt + x[i].childNodes[0].nodeValue + "<br>";
    }
    document.getElementById("demo").innerHTML = txt;
    }
  };
  xhttp.open("GET", "employees.xml", true);
  xhttp.send();
}
</script>

</body>
</html>

Open in new window

employees.xml

<?xml version ="1.0" encoding = "UTF-8"?>
<!-- this a comment -->
<employees>
<employee id ="1">
<first_name>John</first_name>
<last_name>Devon</last_name>
<date_of_joining>
<day>12</day>
<month>1</month>
<year>2014</year>
</date_of_joining>
<department role="the Manager">sales</department>
</employee>
<employee id ="1">
<first_name>Roy</first_name>
<last_name>Sanu</last_name>
<date_of_joining>
<day>1</day>
<month>7</month>
<year>2015</year>
</date_of_joining>
<department role="the Manager">accounting</department>
</employee>
</employees>

Open in new window