JavaScript解析读取XML文件，主要就是加载并解析XML文件，然后就可以测试解析的XML文件的内容，打印输出来。
在线演示：http://demo.jb51.net/js/2012/readxml/
注：测试的时候需要在网站中测试，iis或apache中，注意不要本地双击运行测试
index.htm
<html> <head> <title>脚本之家</title> <script type="text/javascript"> function show() { if (window.XMLHttpRequest) { xmlhttp=new XMLHttpRequest(); } else { xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } if(xmlhttp!=null) { xmlhttp.open("GET","jb51.xml",false); xmlhttp.send(null); var responsexml=xmlhttp.responseXML; var menus=responsexml.getElementsByTagName("Menus")[0]; var html=""; for(var i=0;i<menus.childNodes.length;i++) { var menu=menus.childNodes[i]; html=html+"<h1>"+menu.getAttribute("name")+"</h1><br>"; html=html+"<h2>"+menu.childNodes[0].getAttribute("name")+"</h2><br>"; for(var j=0;j<menu.childNodes[0].childNodes.length;j++) { var mi=menu.childNodes[0].childNodes[j]; var url=mi.getAttribute("url"); var txt=mi.childNodes[0].nodeValue; html=html+" <a href=""+url+"">"+txt+"</a><br>"; } } document.getElementById("tb").innerHTML=html; } else { alert("你用的什么浏览器？"); } } </script> </head> <body onload="show()"> <div id="tb"></div> </body> </html>
xml文件
<?xml version="1.0" encoding="utf-8"?> <Menus> <Menu id="0" name="首页"> <MenuItemTitle sid="01" mid="0" name="常用选项"> <MenuItem mid="0" tid="01" url="Home.aspx">后台首页</MenuItem> <MenuItem mid="0" tid="01" url="Test.aspx">测试页</MenuItem> </MenuItemTitle> </Menu> <Menu id="0" name="试试"> <MenuItemTitle sid="01" mid="0" name="常用选项"> <MenuItem mid="0" tid="01" url="Home.aspx">后台首页</MenuItem> <MenuItem mid="0" tid="01" url="Test.aspx">测试页</MenuItem> </MenuItemTitle> </Menu> </Menus>
没有用TABLE ，是因为显示倒了，所以设置了一个变量，然后显示!值得今后借签!
下面是另外一个例子：
编写了一个JavaScript的类来实现读取一个XML文件中的数据，实现代码如下所示：
<script> /** * @author Shirdrn */ function XMLDoc(){}; // 定义一个XMLDoc类 XMLDoc.prototype.xmlFile = ""; // xmlFile为XMLDoc的一个成员，是指“.xml”文件 XMLDoc.prototype.parseXMLDoc = function(){ // 加载解析XML文件的成员方法 var docParser; if(window.ActiveXObject) { // IE浏览器支持 docParser = new ActiveXObject("Microsoft.XMLDOM"); docParser.async = "false"; docParser.load(this.xmlFile); return docParser; } else if(window.DOMParser) { // Mozillia浏览器支持 docParser = new DOMParser() return docParser.parseFromString(this.xmlFile,"text/xml"); } else { // 如果不是IE和Mozillia浏览器则无法解析，返回false。 return false; } } XMLDoc.prototype.print = function(readTagName,readTagCnt) { // 打印输出读取的XML文件的内容信息 var xmlDoc = this.parseXMLDoc(); // 调用成员方法parseXMLDoc()加载解析XML文件 var users = xmlDoc.getElementsByTagName(readTagName); // 获取指定标签名称的数据的一个数组users for(var i=0 ; i<users.length ; i++) { // 双重循环迭代输出 document.write("<B>第" + (i+1) + "条记录信息：</B><BR>"); for(var j=0 ; j<readTagCnt ; j++) { var tagname = users[i].childNodes[j].tagName; var textvalue = users[i].childNodes[j].text; document.write(tagname + " = " + textvalue + ".<BR>"); } } } var xmlDoc = new XMLDoc(); // 创建一个XMLDoc了IDE对象实例 xmlDoc.xmlFile = "user.xml"; // 设置对象实例的成员变量的数据 xmlDoc.print("user",6); // 打印输出 </script>
其中，我们测试使用的XML文件user.xml的内容如下所示：
<?xml version="1.0" encoding="utf-8" ?> - <users> - <user> <id>22240319830000</id> <name>Shirdrn</name> <age>26</age> <gender>男</gender> <email>shirdrn@hotmail.com</email> <phone>13843140000</phone> </user> - <user> <id>22040319860001</id> <name>Linda</name> <age>23</age> <gender>女</gender> <email>linda@hotmail.com</email> <phone>13843140002</phone> </user> </users>
运行测试程序，解析结果输出如下所示：
第1条记录信息： id = 22240319830000. name = Shirdrn. age = 26. gender = 男. email = shirdrn@hotmail.com. phone = 13843140000. 第2条记录信息： id = 22040319860001. name = Linda. age = 23. gender = 女. email = linda@hotmail.com. phone = 13843140002.
在解析XML文件的时候，要保证对不同类型的浏览器提供支持，这里主要对IE和Mozillia浏览器，否则可能无法解析。
关于其它的说明，可以参看程序中的注释。