You can read an XML format file in HTML and display all its contents on the HTML page, that is, display the tag content, and display the tag itself.
In the following example, we open an XML file ("cd_catalog.xml"), then iterate through each CD element and display the values of the ARTIST element and TITLE element in the HTML table:
<html>
<body>
<script>
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","cd_catalog.xml",false);
xmlhttp.send();
xmlDoc=xmlhttp.responseXML;
document.write("<table border='1'>");
var x=xmlDoc.getElementsByTagName("CD");
for (i=0;i<x.length;i++)
{
document.write("<tr><td>");
document.write(x[i].getElementsByTagName("ARTIST")[0].childNodes[0].nodeValue);
document.write("</td><td>");
document.write(x[i].getElementsByTagName("TITLE")[0].childNodes[0].nodeValue);
document.write("</td></tr>");
}
document.write("</table>");
</script>
</body>
</html>
Try it »
hint:
The information in the CDATA tag is passed intact to the application by the parser, and any control tags in the segment of information are not parsed. The CDATA area is marked by: "〈![CDATA[" as the start mark and "]]〉" as the end mark.
Even the leading and trailing blanks and newline characters in the CDATA area will also be transferred (note that CDATA is an uppercase character).
To learn more about using JavaScript and the XML DOM, visit our XML DOM tutorial.