JavaScript DOM与XML节点访问的浏览器兼容解决方案

作者:窗边听雨时间:2026-10-22 10:10:11浏览:69

本文整理了JavaScript中DOM及XML节点访问在IE与非IE浏览器下的兼容性问题。通过判断浏览器类型,分别采用ActiveXObject与DOMParser进行XML解析,并扩展原型以统一xml、text属性及selectSingleNode/selectNodes方法,实现跨浏览器的节点操作一致性。

JavaScript DOM与XML节点访问的浏览器兼容解决方案

近期在整理浏览器兼容性问题时遇到了不少挑战,但在前人经验的帮助下取得了一定进展。以下分享部分代码,相信对解决类似问题会有所帮助。



具体实现代码如下:

var isIE = ????;
// 全局变量,用于判断是否为IE浏览器,需根据实际情况完善
// 新增DOM操作方法
function parseXML(st){
if (isIE){
var result = new ActiveXObject( "microsoft.XMLDOM" );
result.loadXML(st);
} else {
var parser = new DOMParser();
var result = parser.parseFromString(st, "text/xml" );
    }  
return result;
}  
if ( ! isIE){
var ex;
// 定义节点xml属性
XMLDocument.prototype.__proto__.__defineGetter__( "xml" , function (){
try {
return new XMLSerializer().serializeToString( this );
} catch (ex){
var d = document.createElement( "div" );
d.appendChild( this .cloneNode( true ));
return d.innerHTML;
        }  
    });  
Element.prototype.__proto__.__defineGetter__( "xml" , function (){
try {
return new XMLSerializer().serializeToString( this );
} catch (ex){
var d = document.createElement( "div" );
d.appendChild( this .cloneNode( true ));
return d.innerHTML;
        }  
    });  
//定义节点text属性
XMLDocument.prototype.__proto__.__defineGetter__( "text" , function (){
return this .firstChild.textContent
    });  
Element.prototype.__proto__.__defineGetter__( "text" , function (){
return this .textContent
    });  
// 定义selectSingleNode、selectNodes 方法
XMLDocument.prototype.selectSingleNode = Element.prototype.selectSingleNode = function (xpath){
var x = this .selectNodes(xpath)
if ( ! x || x.length < 1 ) return null ;
return x[ 0 ];
    }  
XMLDocument.prototype.selectNodes = Element.prototype.selectNodes = function (xpath){
var xpe = new XPathEvaluator();
var nsResolver = xpe.createNSResolver( this .ownerDocument == null ?
this .documentElement : this .ownerDocument.documentElement);
var result = xpe.evaluate(xpath, this , nsResolver, 0 , null );
var found = [];
var res;
while (res = result.iterateNext())
found.push(res);
return found;
    }  
}
作者最新文章