XML 教程
1. XML 教程 2. XML 简介 – 什么是 XML? 3. XML 用途 4. XML 树结构 5. XML 语法 6. XML 元素 7. XML 属性 8. XML DTD 9. XML 验证器 10. 查看 XML 文件 11. XML 和 CSS 12. XML 和 XSLT 13. XMLHttpRequest 对象 14. XML 解析器 15. XML DOM 16. 在 HTML 页面中显示 XML 数据 17. XML 应用程序 18. XML 命名空间 19. XML CDATA 20. XML 编码 21. 服务器上的 XML 22. XML DOM 高级 23. XML 注意事项 24. XML 技术 25. 现实生活中的 XML 26. XML 编辑器 27. XML E4X 28. XML 总结 29. XML 实例

在 HTML 页面中显示 XML 数据

HTML 页面显示 XML 数据


在 HTML 页面中显示 XML 数据

在下面的实例中,我们打开一个 XML 文件("cd_catalog.xml"),然后遍历每个 CD 元素,并显示HTML 表格中的 ARTIST 元素和 TITLE 元素的值:

实例

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

55面试教程网 »

如需了解更多关于使用 JavaScript 和 XML DOM 的信息,请访问我们的 XML DOM 教程