不同浏览器读取XML问题

IE和火狐读取XML的方式不同，所以也导致了系统兼容性的问题，下面介绍一种我认为比较好的兼容IE、火狐的读取XML方法。

因为IE和火狐在读取XML节点是有不同的属性，而我们不能再每次写一个节点的时候就判断是否为IE或者为火狐，这样不仅容易出错，而且代码还非常冗余，而如果我们在一开始就判断IE或者火狐的话，即需要些两套对应的代码，如果窗体布局需要修改，就需要修改两个地方，也相对不好维护，而这里我们把IE和火狐读取到的节点装入到数组中，然后通过调用数据来实现显示，是一个不错的解决方法。

 

var xmlChildDoc;    var type = 1;                                        //默认为IE浏览器    var data = new Array();                            //存储实体的数组       if (navigator.userAgent.indexOf("MSIE") > 0) {        xmlChildDoc = new ActiveXObject("Microsoft.XMLDOM");   //实例化dom对象        xmlChildDoc.async = false;        xmlChildDoc.load(path);                       //加载xml文件        // window.alert('IE');    }    else if (isFirefox = navigator.userAgent.indexOf("Firefox") > 0) {        type = 2;        xmlChildDoc = document.implementation.createDocument("", "", null);        //火狐不支持ActiveXObject        xmlChildDoc.async = false;        xmlChildDoc.load(path);    }    else {        window.alert('暂不识别该浏览器!');        return;    }    if (xmlChildDoc) {        var nodes;        if (type == 1)  //判断是否为IE浏览器        {                     if (xmlChildDoc.documentElement == null)                return;  //如果遇到空节点，则返回                        node = xmlChildDoc.documentElement.childNodes;     //这里的node大家可以理解为net中的表,方便大家理解              for (var i = 0; i < node.length; i++) {                var ChildName = node[i].attributes[0].nodeTypedValue;             //取出i行中的字段的值，大家这样理解更方便                var ChildUrl = node[i].attributes[1].nodeTypedValue;                var ChildTarget = node[i].attributes[2].nodeTypedValue;                data.push({ ChildName: ChildName, ChildUrl: ChildUrl, ChildTarget: ChildTarget });                }        }        else {            var node = xmlChildDoc.getElementsByTagName("lititle");            for (var i = 0; i < node.length; i++) {                var ChildName = node[i].attributes[0].nodeValue;             //取出i行中的字段的值，大家这样理解更方便                var ChildUrl = node[i].attributes[1].nodeValue;                var ChildTarget = node[i].attributes[2].nodeValue;                data.push({ ChildName: ChildName, ChildUrl: ChildUrl, ChildTarget: ChildTarget });               }        }    }    else {        window.alert("dom对象为空，失败了!");        return;    }    //获得根接点    var childNodes = xmlChildDoc.documentElement.childNodes;    str += "<div class='menu-list'  ><div class='top-line'></div><ul class='nav-items'>";    for (var i = 0; i < data.length; i++) {        str += "<li class='ceshi move' ><a class='" + strNum + "'  href=javascript:Edit('" + data[i].ChildName + "','" + data[i].ChildUrl + "','" + data[i].ChildTarget + "')";        str += "><span class='" + path + "'>";        str += data[i].ChildName;        str += "</span></a></li>";    }HTML += str + "</ul> </div>";

 

当然，浏览器不仅只有火狐和IE，所以，如果我们想继续兼容该怎么办呢，下面以谷歌和Opera为例。

如果我们像兼容其他浏览器，比如谷歌，谷歌读取XML和IE火狐都不同，所以我们需要在读取的时候在加上判断

 

else if (navigator.userAgent.indexOf("Chrome") >= 0) {        type = 2;        var oXmlHttp = new XMLHttpRequest();        oXmlHttp.open("GET", path, false);        oXmlHttp.send(null);        xmlChildDoc = oXmlHttp.responseXML;    }

 

如果为Opera浏览器，同样，加上判断即可

(navigator.userAgent.indexOf("Opera") >= 0) 

 

这样，如果我们在不同的地方用到浏览器兼容问题，就可以写成判断，然后从网上找出相应浏览器的对于的语句，就可以解决问题了。

 

当然，随着现在浏览器的增加，我们不可能去兼容所有的浏览器，关键在于如何达到一个平衡，让我们的程序兼容主流的浏览器，对于一些很个性的浏览器，我们就可以不必去理会，毕竟，让系统兼容每一个浏览器，是一件费力不讨好的工作。