zoukankan      html  css  js  c++  java
  • 使用js解析xml文档和xml字符串(ie和火狐)

    转载:http://blog.csdn.net/lushuaiyin/article/details/7564631

    使用js解析xml文档和xml字符串。

    分别针对ie和火狐分别作了对xml文档和xml字符串的解析,所有代码都注释掉了,想看哪部分功能,

    去掉注释就可以了。

    至于在ajax环境下解析xml,其实原理是一样的,只不过放在了ajax里,还是要对返回的xml进行解析。

      1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
      2 <html>
      3  <head>
      4   <title> New Document </title>
      5   <meta name="Author" content="lushuaiyin">
      6  </head>
      7  <body>
      8   用js解析xml文档和xml字符串
      9  </body>
     10 </html>
     11 
     12 <script>
     13 //解析xml文档/////////////////////////////////////////////////////
     14 var xmlDoc=null;
     15 
     16 //支持IE浏览器
     17 if(window.ActiveXObject){
     18    xmlDoc=new ActiveXObject("Microsoft.XMLDOM"); 
     19 }
     20 //支持Mozilla浏览器
     21 else if(document.implementation && document.implementation.createDocument){
     22    xmlDoc = document.implementation.createDocument('','',null);
     23 }
     24 else{
     25   alert("here");
     26 }
     27 if(xmlDoc!=null){
     28    xmlDoc.async = false;
     29    xmlDoc.load("house.xml");
     30 }
     31 
     32 //ie和火狐不仅解析器不一样,解析过程也不一样。如下;
     33 //ie解析xml文档
     34 //alert(xmlDoc.getElementsByTagName("address")[0].childNodes[0].childNodes[0].childNodes[0].nodeValue);//弹出150万
     35 //alert(xmlDoc.getElementsByTagName("address")[0].childNodes[0].childNodes[1].childNodes[0].nodeValue);//弹出一室三居
     36 
     37 //层层遍历解析childNodes[1]
     38 //alert(xmlDoc.childNodes[1].childNodes[1].childNodes[0].childNodes[0].nodeValue);//弹出200万
     39 //alert(xmlDoc.childNodes[1].childNodes[0].childNodes[0].childNodes[0].nodeValue);//弹出150万
     40 //alert(xmlDoc.childNodes[1].childNodes[0].childNodes[1].childNodes[0].nodeValue);//弹出一室三居
     41 
     42 
     43 //还可以用item(i)进行遍历
     44 //var nodes=xmlDoc.documentElement.childNodes;
     45 //alert(nodes.item(0).childNodes.item(0).childNodes.item(0).text); //弹出150万
     46 //alert(nodes.item(0).childNodes.item(1).childNodes.item(0).text); //弹出一室三居
     47 
     48 //火狐解析xml文档
     49 //火狐浏览器和ie解析xml不一样节点的值用textContent。
     50 //并且他会在有的层次child节点前后都加上"\n"换行符。(这个搞不清楚为什么,用firebug调试的时候就是这个样子,所以写过的代码最好测试一下,换个环境就不对了)
     51 //也就是说第1个节点是"\n",第2个节点才是真正的第一个节点。
     52 //第3个节点是"\n",第4个节点才是真正的第二个节点。
     53 //层层获取解析childNodes[0]
     54 //alert(xmlDoc.childNodes[0].childNodes[1].childNodes[1].textContent);//弹出150万
     55 //alert(xmlDoc.childNodes[0].childNodes[1].childNodes[3].textContent);//弹出一室三居
     56 
     57 //直接获取节点名解析getElementsByTagName("address")
     58 //alert(xmlDoc.getElementsByTagName("address")[0].textContent);//弹出150万 一室三居 200万  300万
     59 //alert(xmlDoc.getElementsByTagName("address")[0].childNodes[1].textContent);//弹出150万 一室三居
     60 //alert(xmlDoc.getElementsByTagName("address")[0].childNodes[1].childNodes[1].textContent);//弹出150万
     61 //alert(xmlDoc.getElementsByTagName("address")[0].childNodes[1].childNodes[3].textContent);//弹出一室三居
     62 //alert(xmlDoc.getElementsByTagName("address")[0].childNodes[3].textContent);//弹出200万 
     63 
     64 
     65 //火狐也可以用item(1)函数遍历,注意也是有的层次节点前后都加了节点"\n"。
     66 //第一个节点是item(1),第二个节点是item(3),第三个节点是item(5)
     67 //item(1)函数遍历解析
     68 //var nodes=xmlDoc.documentElement.childNodes;
     69 //alert(nodes.item(1).textContent); //弹出150万  一室三居
     70 //alert(nodes.item(1).childNodes.item(1).textContent); //弹出150万  
     71 //alert(nodes.item(1).childNodes.item(3).textContent); //一室三居 
     72 
     73 
     74 
     75 
     76 
     77 
     78 
     79 
     80 //解析xml字符串/////////////////////////////////////////////////////////////////////////
     81 var str="<car>"+
     82 "<brand><price>50万</price><pattern>A6</pattern></brand>"+
     83 "<brand><price>65万</price><pattern>A8</pattern></brand>"+
     84 "<brand><price>17万</price></brand>"+
     85 "</car>";
     86 
     87 //跨浏览器,ie和火狐解析xml使用的解析器是不一样的。
     88 var xmlStrDoc=null;
     89 if (window.DOMParser){// Mozilla Explorer
     90   parser=new DOMParser();
     91   xmlStrDoc=parser.parseFromString(str,"text/xml");
     92 }else{// Internet Explorer
     93   xmlStrDoc=new ActiveXObject("Microsoft.XMLDOM");
     94   xmlStrDoc.async="false";
     95   xmlStrDoc.loadXML(str);
     96 }
     97 
     98 
     99 //ie解析xml字符串
    100 //alert(xmlStrDoc.getElementsByTagName("car")[0].childNodes[0].childNodes[0].childNodes[0].nodeValue);//弹出50万
    101 //alert(xmlStrDoc.getElementsByTagName("car")[0].childNodes[0].childNodes[1].childNodes[0].nodeValue);//弹出A6
    102 
    103 //还可以用item(i)进行遍历
    104 //var strNodes=xmlStrDoc.documentElement.childNodes;
    105 //alert(strNodes.item(0).childNodes.item(0).childNodes.item(0).text); //弹出50万
    106 //alert(strNodes.item(0).childNodes.item(1).childNodes.item(0).text); //弹出A6
    107 
    108 
    109 
    110 //火狐解析xml字符串
    111 //火狐浏览器和ie解析xml不一样节点的值用textContent。
    112 //并且他会在有的层次child节点前后都加上"\n"换行符。
    113 //也就是说第1个节点是"\n",第2个节点才是真正的第一个节点。
    114 //第3个节点是"\n",第4个节点才是真正的第二个节点。
    115 //alert(xmlStrDoc.childNodes[0].childNodes[1].textContent);//弹出65万  A8
    116 //alert(xmlStrDoc.childNodes[0].childNodes[1].childNodes[1].textContent);//A8
    117 //alert(xmlStrDoc.childNodes[0].childNodes[1].childNodes[0].textContent);//弹出65万
    118 
    119 //火狐也可以用item(1)函数遍历,注意也是有的层次节点前后都加了节点"\n"。
    120 //第一个节点是item(1),第二个节点是item(3),第三个节点是item(5)
    121 //var nodes=xmlStrDoc.documentElement.childNodes;
    122 //alert(nodes.item(1).textContent); //弹出65万  A8
    123 //alert(nodes.item(1).childNodes.item(0).textContent); //弹出65万 
    124 //alert(nodes.item(1).childNodes.item(1).textContent); //弹出A8 
    125 
    126 </script>

    其中xml每个节点所在层次是最烦人的问题,只能一次次去试,只要出来一个正确的,

    就很好确定节点的层次关系了,或者debug一下。

    感觉这方面json还是更好阅读和理解。这个解析太费劲了!

     1 <?xml version="1.0" encoding="utf-8" ?> 
     2 <address>
     3    <city name="北京">
     4        <price>150万</price>
     5        <type>一室三居</type>
     6    </city>
     7    <city name="上海">
     8        <price>200万 </price>
     9    </city>
    10    <city name="杭州">
    11        <price>230万</price>
    12    </city>
    13    <city name="南京"></city>
    14 </address>
  • 相关阅读:
    全卷积网络(FCN)与图像分割
    Mac下编译tesseract报错 DotProductAVX can't be used on Android
    OSTU二值化算法
    ssh的用户配置文件config管理ssh会话
    SSD: Single Shot MultiBox Detector 编译方法总结
    论文笔记——A Deep Neural Network Compression Pipeline: Pruning, Quantization, Huffman Encoding
    LeetCode——Word Break
    C#多线程编程
    impinj 编程接口
    C# 委托实例(跨窗体操作控件)
  • 原文地址:https://www.cnblogs.com/yaowukonga/p/2889895.html
Copyright © 2011-2022 走看看