XML data is displayed on the HTML page
May 27, 2021
XML
Table of contents
XML to HTML
You can read the XML format file in HTML and display everything on the HTML page, which displays the label content and the label itself.
XML data is displayed on the HTML page
In the following example, we open an XML file
("cd_catalog.xml")
and then traverse each CD element and display the values of the ARTIST and TITLE elements 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 out . . .
Tips:
The information in the CDATA tag is passed to the application intact by the parser and does not resolve any control tags in that segment of the information. T
he CDATA area is made up of: "Ting!
The "CDATA" is marked for the beginning, with the "
Even blanks at the beginning and end of the CDATA area, as well as line-over characters, are also forwarded (note that CDATA is capital characters).
To learn more about using JavaScript and XML DOM, visit our
XML DOM tutorial.