JS实现兼容各浏览器解析XML文档数据的方法
本文实例讲述了JS实现兼容各浏览器解析XML文档数据的方法。分享给大家供大家参考。具体分析如下：
网站上很多用JS解析XML文档的资料或多或少都有点问题，
以下是自己总结的代码，用来解析XML文档，兼容各个浏览器。
parseXMLDOM.js代码：
/*
*纯JS解析XML文档(兼容各个浏览器)
*/
functionparseXMLDOM(){
var_browserType="";
var_xmlFile="";
var_XmlDom=null;
return{
"getBrowserType":function(){
return_browserType;
},
"setBrowserType":function(browserType){
_browserType=browserType;
},
"getXmlFile":function(){
return_xmlFile;
},
"setXmlFile":function(xmlFile){
_xmlFile=xmlFile;
},
"getXmlDom":function(){
return_XmlDom;
},
"setXmlDom":function(XmlDom){
_XmlDom=XmlDom;
},
"getBrowserType":function(){
varbrowserType="";
if(navigator.userAgent.indexOf("MSIE")!=-1){
browserType="IE";
}elseif(navigator.userAgent.indexOf("Chrome")!=-1){
browserType="Chrome";
}elseif(navigator.userAgent.indexOf("Firefox")!=-1){
browserType="Firefox"
}
returnbrowserType;
},
"createXmlDom":function(xmlDom){
if(this.getBrowserType()=="IE"){//IE浏览器
xmlDom=newActiveXObject('Microsoft.XMLDOM');
xmlDom.async=false;
xmlDom.load(this.getXmlFile());
}else{
varxmlhttp=newXMLHttpRequest();
xmlhttp.open("GET",this.getXmlFile(),false);
xmlhttp.send(null);
xmlDom=xmlhttp.responseXML;
}
returnxmlDom;
},
"parseXMLDOMInfo":function(){
varxmlDom=this.getXmlDom();
if(this.getBrowserType()=="IE"){
varbookObj=xmlDom.selectNodes("books/book");
if(typeof(bookObj)!="undifined"){
varstrHtml="";
for(vari=0;i<bookObj.length;i++){
strHtml+=bookObj[i].selectSingleNode("isbn").text;
strHtml+="";
strHtml+=bookObj[i].selectSingleNode("price").text;
strHtml+="";
strHtml+=bookObj[i].selectSingleNode("title").text;
if(i!=bookObj.length-1){
strHtml+="<br>";
}
}
}
}else{
varbook=xmlDom.getElementsByTagName("book");
varstrHtml="";
for(vari=0;i<book.length;i++){
strHtml+=book[i].getElementsByTagName("isbn")[0].textContent;
strHtml+="";
strHtml+="";
strHtml+=book[i].getElementsByTagName("price")[0].textContent;
strHtml+="";
strHtml+=book[i].getElementsByTagName("title")[0].textContent;
if(i!=book.length-1){
strHtml+="<br>";
}
}
}
document.getElementById("msg").innerHTML=strHtml;
}
}
}
window.onload=function(){
varparseObj=newparseXMLDOM();
//设置浏览器类型
parseObj.setBrowserType(parseObj.getBrowserType());
//设置文件路径
parseObj.setXmlFile("test.xml");
//创建XMLDOM
parseObj.setXmlDom(parseObj.createXmlDom(null));
//解析XMLDOM
parseObj.parseXMLDOMInfo();
}
index.html代码：
<!DOCTYPEhtml> <html> <head> <metahttp-equiv="Content-Type"content="text/html;charset=UTF-8"> <title>JS解析XML文档中的数据(兼容所有浏览器)</title> <scriptlanguage="javascript"type="text/javascript"src="js/parseXMLDOM.js"></script> </head> <body> <spanid="msg"></span> </body> </html>
test.xml代码：
<?xmlversion="1.0"encoding="UTF-8"?> <books> <book> <isbn>2207-1258-123</isbn> <price>25</price> <title>Javascript</title> </book> <book> <isbn>2207-1258-456</isbn> <price>50</price> <title>Ajax</title> </book> <book> <isbn>2207-1258-789</isbn> <price>75</price> <title>C#</title> </book> </books>
希望本文所述对大家的javascript程序设计有所帮助。