<script type='text/javascript'> loadxml = function(xmlfile){ var xmldoc=null; //判断浏览器的类型 //支持ie浏览器 if(!window.domparser && window.activexobject){ var xmldomversions = ['msxml.2.domdocument.6.0','msxml.2.domdocument.3.0','microsoft.xmldom']; for(var i=0;i<xmldomversions.length;i++){ try{ xmldoc = new activexobject(xmldomversions[i]); break; }catch(e){ } } } //支持mozilla浏览器 else if(document.implementation && document.implementation.createdocument){ try{ /* document.implementation.createdocument('','',null); 方法的三个参数说明 * 第一个参数是包含文档所使用的命名空间uri的字符串； * 第二个参数是包含文档根元素名称的字符串； * 第三个参数是要创建的文档类型（也称为doctype） */ xmldoc = document.implementation.createdocument('','',null); }catch(e){ } } else{ return null; } if(xmldoc!=null){ xmldoc.async = false; xmldoc.load(xmlfile); } return xmldoc; } </script>
js解析xml字符串
<script type='text/javascript'> loadxml = function(xmlstring){ var xmldoc=null; //判断浏览器的类型 //支持ie浏览器 if(!window.domparser && window.activexobject){ //window.domparser 判断是否是非ie浏览器 var xmldomversions = ['msxml.2.domdocument.6.0','msxml.2.domdocument.3.0','microsoft.xmldom']; for(var i=0;i<xmldomversions.length;i++){ try{ xmldoc = new activexobject(xmldomversions[i]); xmldoc.async = false; xmldoc.loadxml(xmlstring); //loadxml方法载入xml字符串 break; }catch(e){ } } } //支持mozilla浏览器 else if(window.domparser && document.implementation && document.implementation.createdocument){ try{ /* domparser 对象解析 xml 文本并返回一个 xml document 对象。 * 要使用 domparser，使用不带参数的构造函数来实例化它，然后调用其 parsefromstring() 方法 * parsefromstring(text, contenttype) 参数text:要解析的 xml 标记 参数contenttype文本的内容类型 * 可能是 "text/xml" 、"application/xml" 或 "application/xhtml+xml" 中的一个。注意，不支持 "text/html"。 */ domparser = new domparser(); xmldoc = domparser.parsefromstring(xmlstring, 'text/xml'); }catch(e){ } } else{ return null; } return xmldoc; } </script>
测试xml
<?xml version="1.0" encoding="utf-8" ?> <dongfang> <company> <cnname>1</cnname> <cip>1</cip> </company> <company> <cnname>2</cnname> <cip>2</cip> </company> <company> <cnname>3</cnname> <cip>3</cip> </company> <company> <cnname>4</cnname> <cip>4</cip> </company> <company> <cnname>5</cnname> <cip>5</cip> </company> <company> <cnname>6</cnname> <cip>6</cip> </company> </dongfang>
使用方法
var xmldoc=loadxml(text.xml) var elements = xmldoc.getelementsbytagname("company"); for (var i = 0; i < elements.length; i++) { var name = elements[i].getelementsbytagname("cnname")[0].firstchild.nodevalue; var ip = elements[i].getelementsbytagname("cip")[0].firstchild.nodevalue; }
以上方法适合ie，下面我们来探讨下ie和火狐浏览器下解析xml的问题
分别针对ie和火狐分别作了对xml文档和xml字符串的解析，所有代码都注释掉了，想看哪部分功能，
去掉注释就可以了。
至于在ajax环境下解析xml，其实原理是一样的，只不过放在了ajax里，还是要对返回的xml进行解析。
<script> //解析xml文档///////////////////////////////////////////////////// var xmldoc=null; //支持ie浏览器 if(window.activexobject){ xmldoc=new activexobject("microsoft.xmldom"); } //支持mozilla浏览器 else if(document.implementation && document.implementation.createdocument){ xmldoc = document.implementation.createdocument('','',null); } else{ alert("here"); } if(xmldoc!=null){ xmldoc.async = false; xmldoc.load("house.xml"); } //ie和火狐不仅解析器不一样，解析过程也不一样。如下; //ie解析xml文档 //alert(xmldoc.getelementsbytagname("address")[0].childnodes[0].childnodes[0].childnodes[0].nodevalue);//弹出150万 //alert(xmldoc.getelementsbytagname("address")[0].childnodes[0].childnodes[1].childnodes[0].nodevalue);//弹出一室三居 //层层遍历解析childnodes[1] //alert(xmldoc.childnodes[1].childnodes[1].childnodes[0].childnodes[0].nodevalue);//弹出200万 //alert(xmldoc.childnodes[1].childnodes[0].childnodes[0].childnodes[0].nodevalue);//弹出150万 //alert(xmldoc.childnodes[1].childnodes[0].childnodes[1].childnodes[0].nodevalue);//弹出一室三居 //还可以用item(i)进行遍历 //var nodes=xmldoc.documentelement.childnodes; //alert(nodes.item(0).childnodes.item(0).childnodes.item(0).text); //弹出150万 //alert(nodes.item(0).childnodes.item(1).childnodes.item(0).text); //弹出一室三居 //火狐解析xml文档 //火狐浏览器和ie解析xml不一样节点的值用textcontent。 //并且他会在有的层次child节点前后都加上"\n"换行符。（这个搞不清楚为什么，用firebug调试的时候就是这个样子，所以写过的代码最好测试一下，换个环境就不对了） //也就是说第1个节点是"\n",第2个节点才是真正的第一个节点。 //第3个节点是"\n",第4个节点才是真正的第二个节点。 //层层获取解析childnodes[0] //alert(xmldoc.childnodes[0].childnodes[1].childnodes[1].textcontent);//弹出150万 //alert(xmldoc.childnodes[0].childnodes[1].childnodes[3].textcontent);//弹出一室三居 //直接获取节点名解析getelementsbytagname("address") //alert(xmldoc.getelementsbytagname("address")[0].textcontent);//弹出150万 一室三居 200万 300万 //alert(xmldoc.getelementsbytagname("address")[0].childnodes[1].textcontent);//弹出150万 一室三居 //alert(xmldoc.getelementsbytagname("address")[0].childnodes[1].childnodes[1].textcontent);//弹出150万 //alert(xmldoc.getelementsbytagname("address")[0].childnodes[1].childnodes[3].textcontent);//弹出一室三居 //alert(xmldoc.getelementsbytagname("address")[0].childnodes[3].textcontent);//弹出200万 //火狐也可以用item(1)函数遍历，注意也是有的层次节点前后都加了节点"\n"。 //第一个节点是item(1)，第二个节点是item(3)，第三个节点是item(5) //item(1)函数遍历解析 //var nodes=xmldoc.documentelement.childnodes; //alert(nodes.item(1).textcontent); //弹出150万 一室三居 //alert(nodes.item(1).childnodes.item(1).textcontent); //弹出150万 //alert(nodes.item(1).childnodes.item(3).textcontent); //一室三居 //解析xml字符串///////////////////////////////////////////////////////////////////////// var str="<car>"+ "<brand><price>50万</price><pattern>a6</pattern></brand>"+ "<brand><price>65万</price><pattern>a8</pattern></brand>"+ "<brand><price>17万</price></brand>"+ "</car>"; //跨浏览器，ie和火狐解析xml使用的解析器是不一样的。 var xmlstrdoc=null; if (window.domparser){// mozilla explorer parser=new domparser(); xmlstrdoc=parser.parsefromstring(str,"text/xml"); }else{// internet explorer xmlstrdoc=new activexobject("microsoft.xmldom"); xmlstrdoc.async="false"; xmlstrdoc.loadxml(str); } //ie解析xml字符串 //alert(xmlstrdoc.getelementsbytagname("car")[0].childnodes[0].childnodes[0].childnodes[0].nodevalue);//弹出50万 //alert(xmlstrdoc.getelementsbytagname("car")[0].childnodes[0].childnodes[1].childnodes[0].nodevalue);//弹出a6 //还可以用item(i)进行遍历 //var strnodes=xmlstrdoc.documentelement.childnodes; //alert(strnodes.item(0).childnodes.item(0).childnodes.item(0).text); //弹出50万 //alert(strnodes.item(0).childnodes.item(1).childnodes.item(0).text); //弹出a6 //火狐解析xml字符串 //火狐浏览器和ie解析xml不一样节点的值用textcontent。 //并且他会在有的层次child节点前后都加上"\n"换行符。 //也就是说第1个节点是"\n",第2个节点才是真正的第一个节点。 //第3个节点是"\n",第4个节点才是真正的第二个节点。 //alert(xmlstrdoc.childnodes[0].childnodes[1].textcontent);//弹出65万 a8 //alert(xmlstrdoc.childnodes[0].childnodes[1].childnodes[1].textcontent);//a8 //alert(xmlstrdoc.childnodes[0].childnodes[1].childnodes[0].textcontent);//弹出65万 //火狐也可以用item(1)函数遍历，注意也是有的层次节点前后都加了节点"\n"。 //第一个节点是item(1)，第二个节点是item(3)，第三个节点是item(5) //var nodes=xmlstrdoc.documentelement.childnodes; //alert(nodes.item(1).textcontent); //弹出65万 a8 //alert(nodes.item(1).childnodes.item(0).textcontent); //弹出65万 //alert(nodes.item(1).childnodes.item(1).textcontent); //弹出a8 </script>
其中xml每个节点所在层次是最烦人的问题，只能一次次去试，只要出来一个正确的，
就很好确定节点的层次关系了，或者debug一下。
感觉这方面json还是更好阅读和理解。这个解析太费劲了！
文档house.xml内容如下：
<?xml version="1.0" encoding="utf-8" ?> <address> <city name="北京"> <price>150万</price> <type>一室三居</type> </city> <city name="上海"> <price>200万 </price> </city> <city name="杭州"> <price>230万</price> </city> <city name="南京"></city> </address>
更多js解析xml文件和xml字符串详解。