本文整理了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;
}
}