Display XML Data in an HTML Page

## XML Basic

XML HOME XML Introduction XML How to use XML Tree XML Syntax XML Elements XML Attributes XML Validation XML Validator XML Viewing XML CSS XML XSLT

## XML JavaScript

XML HTTP Request XML Parser XML DOM XML in HTML XML Applications

## XML Advanced

XML Namespaces XML CDATA XML Encoding XML Server XML DOM Advanced XML Technologies XML in Real Life XML Editors XML E4X XML Summary

## XML Examples

XML Examples XML Quiz XML Certificate

# XML in HTML

« Previous
Next Chapter »

## Display XML Data in an HTML Page

In the following example, we open an XML file ("cd_catalog.xml"), then we loop through each CD element, and display the value of the ARTIST element and the TITLE element in an HTML table:

## Example

<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 yourself »

For more information about using JavaScript and the XML DOM, visit our XML DOM tutorial.

« Previous
Next Chapter »

## Your suggestion:

Your E-mail (optional):

Page address:

Description:

Close [X]

## Thank You For Helping Us!

Your message has been sent to W3Schools.

Close [X]
Search w3schools.com:

## WEB HOSTING

Best Web Hosting UK Reseller Hosting Wow! $5 SSD Hosting

## WEB BUILDING

Download XML Editor
FREE Website BUILDER FREE Website Creator

## WEB RESOURCES

Web Statistics Web Validation

## SHARE THIS PAGE