IE、Firefox、Chrome 的JS代码兼容注意事项

来源:互联网 发布:训练鞋 知乎 编辑:程序博客网 时间:2024/05/01 13:34

1.  IE 的XMLHTTP 如果申请一个非XML格式的文件,XMLHttpObject.responseXML 是一个可用的对象。

     Firefox 和 Chrome 则会返回null

     IE我们可以直接 XMLHttpObject.responseXML.loadXML, Firefox 和 Chrome 要通过其他方法

 

var xX=getXMLHttpObj();   

var text = xX.responseText.replaceAll('&','&');   

            var xD=xX.responseXML;   

            if(xD){   

              xD.loadXML(text);   

            }else{   

              var oParser = new DOMParser();   

              xD= oParser.parseFromString(text,"text/xml");   

              //alert(xD.getElementsByTagName("a"));   

            }   

2. 还是XMLHttpObject , IE 和 Chrome 可以 支持 XMLHttpObject.send() 方法里面没有任何参数,Firefox 必须要求最少都要一个参数,即使参数值为null ,即:

 

//要兼容多种浏览器,必须这样写,参数null不能省略:   

XMLHttpObject.send(null);  

3.Firefox 里面 HTMLElementObject.outerHTML 属性无效,IE和Chrome 就很正常,例如我们要删除一个DIV:

 

// 这一句在IE和Chrome 运行很好   

    $("DIV").outerHTML="";  //删除一个DIV   

//firefox 不能则通过上面的语句实现,只能通过以下方法实现    

$("DIV").parentNode.removeChild($("DIV"));   

delete $("DIV"+n);  

4. Firfox 不支持直接用HTMLElementObject 的id 取得该元素,IE和Chrome 则支持得很好。

    Firfox死板的坚持“标准”?!

    例如我们页面上有这样一段HTML代码:

 

<div id="DivObj">this is some text</div>  

     IE和Chrome 可以直接用DivObj 就可以引用这个元素对象。

     Firfox 就在只能用 getElementById('DivObj') 或者著名的$('DivObj')函数了


5. javascript 操作styleSheet对象和rules对象,兼容的写法如下:    

 

var Rules=document.getElementById("xwincss").sheet||document.styleSheets["xwincss"];   

if(Rules.rules){   

  //IE   

   Rules=Rules.rules;   

}else{   

  //firefox   

   Rules=Rules.cssRules;   

}    

6、firefox和ie事件event处理 

在ie中,事件对象是作为一个全局变量来保存和维护的。 所有的浏览器事件,不管是用户触发 

的,还是其他事件, 都会更新window.event 对象。 所以在代码中,只要轻松调用 window.event 

就可以轻松获取 事件对象, 再 event.srcElement 就可以取得触发事件的元素进行进一步处理 

在ff中, 事件对象却不是全局对象,一般情况下,是现场发生,现场使用,ff把事件对象自动传 

递给对应的事件处理函数。 在代码中,函数的第一个参数就是ff下的事件对象了。 

 

//<button id="btn4" onclick="foo4()">按钮4</button>    

function foo4(){    

var evt=getEvent();    

var element=evt.srcElement || evt.target ;    

alert(element.id)    

}    

function getEvent()    

{ //同时兼容ie和ff的写法    

if(document.all) return window.event;    

func=getEvent.caller;    

while(func!=null){    

var arg0=func.arguments[0];    

if(arg0){    

if((arg0.constructor==Event || arg0.constructor ==MouseEvent) || (typeof(arg0)=="object" && arg0.preventDefault && arg0.stopPropagation)){    

return arg0;    

}    

}    

func=func.caller;    

}    

return null;    

}    


7、firefox和ie对手型指针cursor不兼容 

手型指针有cursor:hand和cursor:pointer两种写法,其中cursor:hand在ff中不支持,返回错误! 

只要使用cursor:pointer即可,ff和ie都支持! 

0 0