使用js解析xml文档和xml字符串(ie和火狐)
2013-01-16 14:59
736 查看
原文:http://blog.csdn.net/lushuaiyin/article/details/7564631
使用js解析xml文档和xml字符串。
分别针对ie和火狐分别作了对xml文档和xml字符串的解析,所有代码都注释掉了,想看哪部分功能,
去掉注释就可以了。
至于在ajax环境下解析xml,其实原理是一样的,只不过放在了ajax里,还是要对返回的xml进行解析。
其中xml每个节点所在层次是最烦人的问题,只能一次次去试,只要出来一个正确的,
就很好确定节点的层次关系了,或者debug一下。
感觉这方面json还是更好阅读和理解。这个解析太费劲了!
文档house.xml内容如下:
使用js解析xml文档和xml字符串。
分别针对ie和火狐分别作了对xml文档和xml字符串的解析,所有代码都注释掉了,想看哪部分功能,
去掉注释就可以了。
至于在ajax环境下解析xml,其实原理是一样的,只不过放在了ajax里,还是要对返回的xml进行解析。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title> New Document </title> <meta name="Author" content="lushuaiyin"> </head> <body> 用js解析xml文档和xml字符串 </body> </html> <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字符串(ie和火狐)
- 使用js解析xml文档和xml字符串(ie和火狐)
- js解析xml字符串和xml文档实现原理及代码(针对ie与火狐)
- js解析xml字符串和xml文档实现原理及代码(针对ie与火狐)
- jquery解析xml文档和xml字符串(ie和火狐环境下)
- 解决IE中无法使用jquery.find方法解析xml字符串的方法
- js里各浏览器解析XML,支持IE、火狐、Chrome等
- jQuery使用ajax传输xml文档在IE中无法正确解析的问题
- 使用Js解析xml字符串和xml文件
- JS解析XML数据,ActiveXObject("Microsoft.XMLDOM")对象兼容IE和火狐
- xml解析技术概述和使用Jaxp对xml文档进行dom解析
- JS读取XML文件数据并以table形式显示数据的方法(兼容IE与火狐)
- 使用dom4j解析xml字符串
- java使用dom4j生成与解析xml文档的方法示例
- 使用dom4j解析XML文档
- js字符串转换成xml对象并使用技巧解读
- js字符串转换成xml并使用
- 递归打印XML文档树-使用w3cDOM模型解析
- 使用dom4j解析、增删改xml文档,xPath技和SAX解析
- ie无法使用jquery解析xml的解决方法