不同瀏覽器讀取XML問題

IE和Firefox讀取XML的方式不同，所以也導致了系統相容性的問題，下面介紹一種我認為比較好的相容IE、Firefox的讀取XML方法。

因為IE和Firefox在讀取XML節點是有不同的屬性，而我們不能再每次寫一個節點的時候就判斷是否為IE或者為Firefox，這樣不僅容易出錯，而且代碼還非常冗餘，而如果我們在一開始就判斷IE或者Firefox的話，即需要些兩套對應的代碼，如果表單布局需要修改，就需要修改兩個地方，也相對不好維護，而這裡我們把IE和Firefox讀取到的節點裝入到數組中，然後通過調用資料來實現顯示，是一個不錯的解決方案。

 

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);        //Firefox不支援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>";

 

當然，瀏覽器不僅只有Firefox和IE，所以，如果我們想繼續相容該怎麼辦呢，下面以Google和Opera為例。

如果我們像相容其他瀏覽器，比如Google，Google讀取XML和IEFirefox都不同，所以我們需要在讀取的時候在加上判斷

 

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) 

 

這樣，如果我們在不同的地方用到瀏覽器安全色問題，就可以寫成判斷，然後從網上找出相應瀏覽器的對於的語句，就可以解決問題了。

 

當然，隨著現在瀏覽器的增加，我們不可能去相容所有的瀏覽器，關鍵在於如何達到一個平衡，讓我們的程式相容主流的瀏覽器，對於一些很個性的瀏覽器，我們就可以不必去理會，畢竟，讓系統相容每一個瀏覽器，是一件費力不討好的工作。