JS- 操作 XML(兼容IE/FF/Chrome,Safari)

最新推荐文章于 2019-10-09 21:13:16 发布

立早成文

最新推荐文章于 2019-10-09 21:13:16 发布

阅读量256

点赞数

分类专栏： js及各种框架文章标签： js xml

本文链接：https://blog.youkuaiyun.com/lizaochengwen/article/details/84120500

版权

js及各种框架专栏收录该内容

27 篇文章

订阅专栏

今天同事有需要JS显示XML!
后来就做了一个效果!或许以后能用的着呢! ^_^
JS读取并输出xml文件节点及属性（兼容IE，FF） !
好东东发出来分享一下了!
代码如下：

Html代码 

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
    <html xmlns="http://www.w3.org/1999/xhtml">  
    <head>  
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />  
    <title>JS读取XML兼容IE/FF/Chrome,Safari</title>  
    <style>  
    li{list-style:none;}  
    </style>  
    <script type="text/javascript">  
    //==============================================================  
    var orderDoc;  
    //获取xml文件  
    function loadXmlFile(xmlFile){  
      var xmlDom = null;  
      if (window.ActiveXObject){  
        xmlDom = new ActiveXObject("Microsoft.XMLDOM");  
        xmlDom.async=false;  
       xmlDom.load(xmlFile)||xmlDom.loadXML(xmlFile);//如果用的是XML字符串//如果用的是xml文件  
      }else if (document.implementation && document.implementation.createDocument){  
        var xmlhttp = new window.XMLHttpRequest();  
        xmlhttp.open("GET", xmlFile, false);  
        xmlhttp.send(null);  
        xmlDom = xmlhttp.responseXML;  
      }else{  
        xmlDom = null;  
      }  
      return xmlDom;  
    }  
    //判断子节点为不为空  
    function isnull(obj)  
    {  
        var nodevalue = "";  
        if(obj.childNodes[0] != null)  
        {  
            nodevalue =obj.childNodes[0].nodeValue;  
        }  
        return nodevalue;  
    }  
    var stringsss="";  
    //根据编号获取数据  
    function getDataByid(number)  
    {  
        var time =isnull(orderDoc.getElementsByTagName("time")[number]);  
        var place =isnull(orderDoc.getElementsByTagName("place")[number]);  
        var reason =isnull(orderDoc.getElementsByTagName("reason")[number]);  
        var unit = isnull(orderDoc.getElementsByTagName("unit")[number]);  
        var money =isnull(orderDoc.getElementsByTagName("money")[number]);  
        var status =isnull(orderDoc.getElementsByTagName("status")[number]);  
        var docNum =isnull(orderDoc.getElementsByTagName("docNum")[number]);  
        var score =isnull(orderDoc.getElementsByTagName("score")[number]);  
        var std='<li><b>网址:'+(time)+'<br />站名称:'+(place)+'<br />描述:'+(reason)+'</b></li>';  
        return std;  
    }  

    //获得页面内容  
    function getContent(){  
        //exBrows();  
        orderDoc=loadXmlFile("http://www.ok22.org/download/ex2.xml");  
            var items=orderDoc.getElementsByTagName("results").length;  
            //alert(orderDoc.getElementsByTagName("Item").length);  
            var htmlstr="";  
            stringsss+='<ul>';  
            for(i=0;i<items;i++){  
                stringsss+=getDataByid(i);  
            }  
            stringsss+='</ul>'  
            document.write(stringsss);  
    }  
    </script>  

    </head>  

    <body>  
    </body>  
    <script type="text/javascript" language="javascript">  
    getContent();  
    </script>  
    </html>

因为XML有可能为空所以添加了一个判断节点是否为空!

Js代码 

    //判断子节点为不为空  
    function isnull(obj)  
    {  
        var nodevalue = "";  
        if(obj.childNodes[0] != null)  
        {  
            nodevalue =obj.childNodes[0].nodeValue;  
        }  
        return nodevalue;  
    }

转自:http://www.ok22.org/art_detail.aspx?id=137