《js在IE和Firefox不同之处.docx》由会员分享,可在线阅读,更多相关《js在IE和Firefox不同之处.docx(6页珍藏版)》请在第一文库网上搜索。
1、js在IE和Firefox不同之处做Web类项目,不可避免的要涉及浏览器的兼容性问题,特别是javascript的兼容性问题,典型代表就是IE浏览器与FireFox浏览器,熟悉到不一致之处就能够避免出现使用不一致浏览器时可能会出现的兼容性问题,找了一些关于js在IE与FireFox中区别的资料,以供参考。1. document,form,item问题问题:现有代码中存在许多document.formName.item(z,itemNamez,)这样的语句,不能在FirefOX下运行解决方法:统一使用document.formName.e1ementsz,e1ementName,z2. 集合类对
2、象问题问题:IE下,能够使用()或者口获取集合类对象;FirefOX下,只能使用口获取集合类对象解决方法:改用作为下标运算。如:document,forms(*formNamez,)改为document,formsformName”又如:document.getE1ementsByName(z,inputName*)(1)改为document.getE1ementsByName(*inputNamezr)13. event获取event问题:window,event只能在IE下运行,而不能在Eirefox下运行,这是由于Firefox的event只能在事件发生的现场使用。解决方法:在IE中,不
3、能把Event对象作为参数传递给事件处理程序,只能用window,event或者者event来引用Event对象。Firefox中获取event的方法:(1) 从HTM1页面传递参数event(2)event=arguments,ca11ee,ca11er,arguments0;functiongetEvent(evt)evt=evt?evt:(window.event?window.event:nu11);event属性问题:IE下,even1对象有x,y属性,但是没有pageX,PageY属性;FirefOX下,event对象有pageX,PageY属性,但是没有X,y属性。Firefox
4、中的event.pageX相当于IE中的event.X解决方法:event,x=event,x?event,x:event.pageX;其它:event.IayerX在IE与火狐中都有,具体意义有无差别尚未试验。4. HTM1对象的id作为对象名的问题问题:在IE中,HTM1对象的ID能够作为document的下属对象变量名直接使用,而在Firefox中不能。解决方法:统一用getE1ementById(z,idNamez,)代替idName作为对象变量使用。5. 用idName字符串取得对象的问题问题:在IE中,利用eva1(idName)能够取得id为idName的HTM1对象,而在Fir
5、efox中不能。解决方法:统一使用getE1ementBy1d(idName)代替eva1(idName)6,变量名与某HTM1对象id相同的问题问题:IE中HTM1对象的ID能够作为document的下属对象变量名直接使用;而Firefox则不能。在FirefOX中,使用与HTM1对象ID相同的变量名;IE下则不能。解决方法:统一使用使用document.getE1ementBy1d(idName)代替document.idName在声明变量时,一律加上var,以避免歧义。此外,最好不要取与HTM1对象id相同的变量名,以减少错误。8. frame问题问题:在IE中能够用window.tes
6、tFrame取得该frame,而Firefox中不行解决方法:在frame的使用方面火狐与ie的最要紧的区别是:IE能够通过id或者者name访问这个frame对应的window对象而Firefox只能够通过name来访问这个frame对应的window对象假如上述frame标签写在最上层的WindoW里面的htm里面,那么能够这样访问IE:window,top.frameId或者者window,top.frameName来访问这个window对象Firefox:只能这样window.top.frameName来访问这个window对象另外,在火狐与IE中都能够使用WindOW.top.doc
7、ument.getE1ementBy1d(frame1d)来访问frame标签同时能够通过window,top.document.getE1ementBy1d(z,testFrame,z).src=xx.htm来切换frame的内容也都能够通过window.top.frameName.1ocation=xx.htm,来切换frame的内容9. 在FirefOX中,自己定义的属性务必ge1Attribute()取得if(document,a11)/IE下为dig对象添加事件dig.SetAttribute(,onmouSedownzz,functionOmove_Div(this););)e1s
8、eFirefOX下为dig对象添加事件dig.SetAttribute(onmousedowr,“move_Div(this)J);)10. 在FirefoX中没有parentE1ementchi1dren而用parentNodechiIdNodesChi1dNodes的下标的含义在IE与Firefox中不一致,Firefox使用DoM规范,Chi1dNodes中会插入空白文本节点一一firefox下Chi1dNodes会把换行与空白字符都算作父节点的子节点,而ie的Chi1dNodes与chi1dren不可能。通常能够通过node.getE1ementsByTagName()来回避这个问题。
9、当htm1中节点缺失时,IE与Firefox对parentNode的解释不一致,比如Firefox中input.parentNode的值为form,而IE中input.parentNode的值为空节点Firefox中节点没有removeNode方法,务必使用如下方法node.parentNode.removeChi1d(node)11. const问题问题:在IE中不能使用const关键字。如constConstVar=32;在IE中这是语法错误。方法:不使用const,以var代替。12. body对象Firefox的body在body标签没有被浏览器完全读入之前就存在,而IE则务必在bod
10、y完全被读入之后才存在13. ur1encoding在JS中假如书写ur1就直接写&不要用&假如varur1=xx.jsp7objectName=xxobjectEvent=xx,;那么frm.action=ur1时,ur1很有可能不可能被正常显示以至于参数没有正确的传到服务器,通常会服务器报错参数没有找到。当然在tp1中例外,由于tp1中符合xm1规范,要求&书写为&通常Firefox无法识别JS中的&14. nodeName与tagName问题问题:在FirefOX中,所有节点均有nodeName值,但textNode没有tagName值。在IE中,nodeName的使用好象有问题。解决方
11、法:使用tagName,但应检测其是否为空。15. input,type属性问题IE下input,type属性为只读,但是FirefoX下能够修改16. document.getE1ementsByName()与document.a11name的问题问题:在IE中,getEIementsByName()document,a11name均不能用来取得div元素(是否还有其它不能取的元素还不明白)。17. event.SrcE1ement问题问题:IE下,even对象有SrcE1ement属性,但是没有target属性;Firefox下,even对象有target属性,但是没有SrcE1ement
12、属性。解决方法:使用obj(obj=event.SrcE1ement?event.SrcE1ement:event,target;)来代替IE下的event.SrcE1ement或者者Firefox下的event,target18. 模态与非模态窗口问题问题:IE下,能够通过ShowModa1Dia1og与ShowMode1essDia1og打开模态与非模态窗口;FirefoX下则不能。解决方法:直接使用window,open(pageUR1,name,ParameterS)方式打开新窗口。假如需要将子窗口中的参数传递回父窗口,能够在子窗口中使用WindOW.0Pener来访问父窗口比如:va
13、rparentWin=window,opener;parentWin.document.getE1ementById(z,Aqingz,).va1ue=Aqing”;19. 事件委托方法IE:document,body,on1oad:inject;/Functioninject()在这之前已被实现Firefox:document,body,on1oad=inject();有人说标准是:document.body,on1oad=newFunction(,injectO,);20. firefox与IE(ParentE1einent)的父元素的区别IE:obj.ParentE1ementfiref
14、ox:obj.parentNode解决方法:由于firefox与IE都支持DOM,因此使用obj.parentNode是不错选择。21. CursorihandVSCursoripointerFirefoX不支持hand,但IE支持POinter解决方法:统一使用pointer22. InnerText在IE中能正常工作,但是innerText在FireFox中却不行.解决方法:if(navigator.appName.indexf(*Exp1orerz,)-1)document.getE1ementBy1d(,e1ement*).innerText=mytext”;e1sedocument.
15、getE1ementBy1d(,e1ement*).IextContent=mytext”;23. FireFoX中类似obj.sty1e,height=imgbj.height的语句无效解决方法:obj.sty1e,height=imgbj.height+px;24. IE,Firefox与其它浏览器关于tab1e标签的操作都各不相同,在ie中不同意对tab1e与tr的innerHTM1赋值,使用js增加一个tr时,使用appendChi1e方法也不管用。解决方法:向tab1e追加一个空行varrow=otab1e.insertRow(-1);varce11=document.CreateE1ement(*tdz,);ce11.innerHTM1=;ce11.C1assName=XXXX;row.appendChi1d(ce11);25. padding问题FireFox无法解释