亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

JS解析XML文件和XML字符串詳解

 更新時(shí)間:2015年04月17日 16:00:20   投稿:hebedich  
這篇文章主要介紹了JS解析XML文件和XML字符串詳解,推薦給大家,有需要的小伙伴可以參考下。

JS解析XML文件

<script type='text/javascript'>
loadXML = function(xmlFile){
var xmlDoc=null;
//判斷瀏覽器的類(lèi)型
//支持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); 方法的三個(gè)參數(shù)說(shuō)明
* 第一個(gè)參數(shù)是包含文檔所使用的命名空間URI的字符串;
* 第二個(gè)參數(shù)是包含文檔根元素名稱(chēng)的字符串;
* 第三個(gè)參數(shù)是要?jiǎng)?chuàng)建的文檔類(lèi)型(也稱(chēng)為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;
//判斷瀏覽器的類(lèi)型
//支持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 對(duì)象解析 XML 文本并返回一個(gè) XML Document 對(duì)象。
* 要使用 DOMParser,使用不帶參數(shù)的構(gòu)造函數(shù)來(lái)實(shí)例化它,然后調(diào)用其 parseFromString() 方法
* parseFromString(text, contentType) 參數(shù)text:要解析的 XML 標(biāo)記 參數(shù)contentType文本的內(nèi)容類(lèi)型
* 可能是 "text/xml" 、"application/xml" 或 "application/xhtml+xml" 中的一個(gè)。注意,不支持 "text/html"。
*/
domParser = new DOMParser();
xmlDoc = domParser.parseFromString(xmlString, 'text/xml');
}catch(e){
}
}
else{
return null;
}
return xmlDoc;
}
</script>

測(cè)試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,下面我們來(lái)探討下IE和火狐瀏覽器下解析XML的問(wèn)題

分別針對(duì)ie和火狐分別作了對(duì)xml文檔和xml字符串的解析,所有代碼都注釋掉了,想看哪部分功能,
去掉注釋就可以了。

至于在ajax環(huán)境下解析xml,其實(shí)原理是一樣的,只不過(guò)放在了ajax里,還是要對(duì)返回的xml進(jìn)行解析。

<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和火狐不僅解析器不一樣,解析過(guò)程也不一樣。如下; 
//ie解析xml文檔 
//alert(xmlDoc.getElementsByTagName("address")[0].childNodes[0].childNodes[0].childNodes[0].nodeValue);//彈出150萬(wàn) 
//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萬(wàn) 
//alert(xmlDoc.childNodes[1].childNodes[0].childNodes[0].childNodes[0].nodeValue);//彈出150萬(wàn) 
//alert(xmlDoc.childNodes[1].childNodes[0].childNodes[1].childNodes[0].nodeValue);//彈出一室三居 

//還可以用item(i)進(jìn)行遍歷 
//var nodes=xmlDoc.documentElement.childNodes; 
//alert(nodes.item(0).childNodes.item(0).childNodes.item(0).text); //彈出150萬(wàn) 
//alert(nodes.item(0).childNodes.item(1).childNodes.item(0).text); //彈出一室三居 

//火狐解析xml文檔 
//火狐瀏覽器和ie解析xml不一樣節(jié)點(diǎn)的值用textContent。 
//并且他會(huì)在有的層次child節(jié)點(diǎn)前后都加上"\n"換行符。(這個(gè)搞不清楚為什么,用firebug調(diào)試的時(shí)候就是這個(gè)樣子,所以寫(xiě)過(guò)的代碼最好測(cè)試一下,換個(gè)環(huán)境就不對(duì)了) 
//也就是說(shuō)第1個(gè)節(jié)點(diǎn)是"\n",第2個(gè)節(jié)點(diǎn)才是真正的第一個(gè)節(jié)點(diǎn)。 
//第3個(gè)節(jié)點(diǎn)是"\n",第4個(gè)節(jié)點(diǎn)才是真正的第二個(gè)節(jié)點(diǎn)。 
//層層獲取解析childNodes[0] 
//alert(xmlDoc.childNodes[0].childNodes[1].childNodes[1].textContent);//彈出150萬(wàn) 
//alert(xmlDoc.childNodes[0].childNodes[1].childNodes[3].textContent);//彈出一室三居 

//直接獲取節(jié)點(diǎn)名解析getElementsByTagName("address") 
//alert(xmlDoc.getElementsByTagName("address")[0].textContent);//彈出150萬(wàn) 一室三居 200萬(wàn) 300萬(wàn) 
//alert(xmlDoc.getElementsByTagName("address")[0].childNodes[1].textContent);//彈出150萬(wàn) 一室三居 
//alert(xmlDoc.getElementsByTagName("address")[0].childNodes[1].childNodes[1].textContent);//彈出150萬(wàn) 
//alert(xmlDoc.getElementsByTagName("address")[0].childNodes[1].childNodes[3].textContent);//彈出一室三居 
//alert(xmlDoc.getElementsByTagName("address")[0].childNodes[3].textContent);//彈出200萬(wàn)  

//火狐也可以用item(1)函數(shù)遍歷,注意也是有的層次節(jié)點(diǎn)前后都加了節(jié)點(diǎn)"\n"。 
//第一個(gè)節(jié)點(diǎn)是item(1),第二個(gè)節(jié)點(diǎn)是item(3),第三個(gè)節(jié)點(diǎn)是item(5) 
//item(1)函數(shù)遍歷解析 
//var nodes=xmlDoc.documentElement.childNodes; 
//alert(nodes.item(1).textContent); //彈出150萬(wàn) 一室三居 
//alert(nodes.item(1).childNodes.item(1).textContent); //彈出150萬(wàn)  
//alert(nodes.item(1).childNodes.item(3).textContent); //一室三居  

//解析xml字符串///////////////////////////////////////////////////////////////////////// 
var str="<car>"+ 
"<brand><price>50萬(wàn)</price><pattern>A6</pattern></brand>"+ 
"<brand><price>65萬(wàn)</price><pattern>A8</pattern></brand>"+ 
"<brand><price>17萬(wàn)</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萬(wàn) 
//alert(xmlStrDoc.getElementsByTagName("car")[0].childNodes[0].childNodes[1].childNodes[0].nodeValue);//彈出A6 
 
//還可以用item(i)進(jìn)行遍歷 
//var strNodes=xmlStrDoc.documentElement.childNodes; 
//alert(strNodes.item(0).childNodes.item(0).childNodes.item(0).text); //彈出50萬(wàn) 
//alert(strNodes.item(0).childNodes.item(1).childNodes.item(0).text); //彈出A6 
 
//火狐解析xml字符串 
//火狐瀏覽器和ie解析xml不一樣節(jié)點(diǎn)的值用textContent。 
//并且他會(huì)在有的層次child節(jié)點(diǎn)前后都加上"\n"換行符。 
//也就是說(shuō)第1個(gè)節(jié)點(diǎn)是"\n",第2個(gè)節(jié)點(diǎn)才是真正的第一個(gè)節(jié)點(diǎn)。 
//第3個(gè)節(jié)點(diǎn)是"\n",第4個(gè)節(jié)點(diǎn)才是真正的第二個(gè)節(jié)點(diǎn)。 
//alert(xmlStrDoc.childNodes[0].childNodes[1].textContent);//彈出65萬(wàn) A8 
//alert(xmlStrDoc.childNodes[0].childNodes[1].childNodes[1].textContent);//A8 
//alert(xmlStrDoc.childNodes[0].childNodes[1].childNodes[0].textContent);//彈出65萬(wàn) 
 
//火狐也可以用item(1)函數(shù)遍歷,注意也是有的層次節(jié)點(diǎn)前后都加了節(jié)點(diǎn)"\n"。 
//第一個(gè)節(jié)點(diǎn)是item(1),第二個(gè)節(jié)點(diǎn)是item(3),第三個(gè)節(jié)點(diǎn)是item(5) 
//var nodes=xmlStrDoc.documentElement.childNodes; 
//alert(nodes.item(1).textContent); //彈出65萬(wàn) A8 
//alert(nodes.item(1).childNodes.item(0).textContent); //彈出65萬(wàn)  
//alert(nodes.item(1).childNodes.item(1).textContent); //彈出A8  
 
</script> 

其中xml每個(gè)節(jié)點(diǎn)所在層次是最煩人的問(wèn)題,只能一次次去試,只要出來(lái)一個(gè)正確的,
就很好確定節(jié)點(diǎn)的層次關(guān)系了,或者debug一下。
感覺(jué)這方面json還是更好閱讀和理解。這個(gè)解析太費(fèi)勁了!

文檔house.xml內(nèi)容如下:

<?xml version="1.0" encoding="utf-8" ?>  
<address> 
  <city name="北京"> 
    <price>150萬(wàn)</price> 
    <type>一室三居</type> 
  </city> 
  <city name="上海"> 
    <price>200萬(wàn) </price> 
  </city> 
  <city name="杭州"> 
    <price>230萬(wàn)</price> 
  </city> 
  <city name="南京"></city> 
</address> 

以上所述就是本文的全部?jī)?nèi)容了,希望大家能夠喜歡。

相關(guān)文章

  • JavaScript之解構(gòu)賦值的理解

    JavaScript之解構(gòu)賦值的理解

    今天小編就為大家分享一篇關(guān)于JavaScript之解構(gòu)賦值的理解,小編覺(jué)得內(nèi)容挺不錯(cuò)的,現(xiàn)在分享給大家,具有很好的參考價(jià)值,需要的朋友一起跟隨小編來(lái)看看吧
    2019-01-01
  • 微信小程序?qū)崿F(xiàn)吸頂效果

    微信小程序?qū)崿F(xiàn)吸頂效果

    這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)吸頂效果,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下
    2020-01-01
  • js表單登陸驗(yàn)證示例

    js表單登陸驗(yàn)證示例

    這篇文章主要介紹了js表單登陸驗(yàn)證的方法,基于thinkPHP前端頁(yè)面實(shí)現(xiàn)javascript針對(duì)表單用戶(hù)名與密碼的驗(yàn)證功能,需要的朋友可以參考下
    2016-10-10
  • JS日期和時(shí)間選擇控件升級(jí)版(自寫(xiě))

    JS日期和時(shí)間選擇控件升級(jí)版(自寫(xiě))

    鑒于網(wǎng)上找到的幾個(gè)日期選擇程序有些問(wèn)題,遂著手重寫(xiě)一個(gè)程序,添加了時(shí)間選擇功能,截圖及源碼如下,有需要的朋友可以參考下
    2013-08-08
  • JS實(shí)現(xiàn)動(dòng)態(tài)添加DOM節(jié)點(diǎn)和事件的方法示例

    JS實(shí)現(xiàn)動(dòng)態(tài)添加DOM節(jié)點(diǎn)和事件的方法示例

    這篇文章主要介紹了JS實(shí)現(xiàn)動(dòng)態(tài)添加DOM節(jié)點(diǎn)和事件的方法,涉及javascript事件響應(yīng)及針對(duì)頁(yè)面dom元素節(jié)點(diǎn)與屬性的動(dòng)態(tài)操作相關(guān)實(shí)現(xiàn)技巧,需要的朋友可以參考下
    2017-04-04
  • js實(shí)現(xiàn)的二分查找算法實(shí)例

    js實(shí)現(xiàn)的二分查找算法實(shí)例

    這篇文章主要介紹了js實(shí)現(xiàn)的二分查找算法,結(jié)合實(shí)例形式較為詳細(xì)的分析了JavaScript簡(jiǎn)單實(shí)現(xiàn)二分查找算法的運(yùn)算原理與具體步驟,需要的朋友可以參考下
    2016-01-01
  • 淺析js中的every()對(duì)空數(shù)組總返回true

    淺析js中的every()對(duì)空數(shù)組總返回true

    JavaScript?語(yǔ)言的核心部分足夠大,以至于我們很容易誤解其某些部分的工作方式,本文就來(lái)和大家一起討論下為什么JS中的?every()對(duì)空數(shù)組總返回?true,需要的可以參考下
    2023-09-09
  • JS實(shí)現(xiàn)iframe中子父頁(yè)面跨域通訊的方法分析

    JS實(shí)現(xiàn)iframe中子父頁(yè)面跨域通訊的方法分析

    這篇文章主要介紹了JS實(shí)現(xiàn)iframe中子父頁(yè)面跨域通訊的方法,結(jié)合實(shí)例形式分析了JS實(shí)現(xiàn)iframe頁(yè)面跨域通訊常見(jiàn)操作技巧與相關(guān)注意事項(xiàng),需要的朋友可以參考下
    2020-03-03
  • javascript實(shí)現(xiàn)文件拖拽事件

    javascript實(shí)現(xiàn)文件拖拽事件

    這篇文章主要為大家詳細(xì)介紹了javascript實(shí)現(xiàn)文件拖拽事件,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下
    2018-03-03
  • JavaScript 上萬(wàn)關(guān)鍵字瞬間匹配實(shí)現(xiàn)代碼

    JavaScript 上萬(wàn)關(guān)鍵字瞬間匹配實(shí)現(xiàn)代碼

    發(fā)一篇之前寫(xiě)的文章,平時(shí)還是經(jīng)常用到的,尤其是河蟹詞特別多的聊天系統(tǒng)里
    2013-07-07

最新評(píng)論