JavaScript在IE和Firefox上的差异及相互替代的实现方法第1/2页

 更新时间:2008年06月24日 23:29:33   转载 作者:  
我们经常在处理ie和firefox下的js总会碰到一些兼容问题,下面是些总结,希望大家仔细看看研究

1.document.formName.item("itemName") 问题

说明:IE下,可以使用document.formName.item("itemName")或document.formName.elements["elementName"];Firefox下,只能使用document.formName.elements["elementName"].
解决方法:统一使用document.formName.elements["elementName"].

2.集合类对象问题

说明:IE下,可以使用()或[]获取集合类对象;Firefox下,只能使用[]获取集合类对象.
解决方法:统一使用[]获取集合类对象.

3.自定义属性问题

说明:IE下,可以使用获取常规属性的方法来获取自定义属性,也可以使用getAttribute()获取自定义属性;Firefox下,只能使用getAttribute()获取自定义属性.
解决方法:统一通过getAttribute()获取自定义属性.

4.eval("idName")问题

说明:IE下,,可以使用eval("idName")或getElementById("idName")来取得id为idName的HTML对象;Firefox下只能使用getElementById("idName")来取得id为idName的HTML对象.
解决方法:统一用getElementById("idName")来取得id为idName的HTML对象.

5.变量名与某HTML对象ID相同的问题

说明:IE下,HTML对象的ID可以作为document的下属对象变量名直接使用;Firefox下则不能.Firefox下,可以使用与HTML对象ID相同的变量名;IE下则不能。
解决方法:使用document.getElementById("idName")代替document.idName.最好不要取HTML对象ID相同的变量名,以减少错误;在声明变量时,一律加上var,以避免歧义.

6.const问题

说明:Firefox下,可以使用const关键字或var关键字来定义常量;IE下,只能使用var关键字来定义常量.
解决方法:统一使用var关键字来定义常量.

7.input.type属性问题

说明:IE下input.type属性为只读;但是Firefox下input.type属性为读写.

8.window.event问题

说明:window.event只能在IE下运行,而不能在Firefox下运行,这是因为Firefox的event只能在事件发生的现场使用.
解决方法:
IE:
<input name="Button8_1" type="button" value="IE" onclick="javascript:gotoSubmit8_1()"/>
...
<script language="javascript">
function gotoSubmit8_1() {
...
alert(window.event); //use window.event
...
}
</script>
IE&Firefox:
<input name="Button8_2" type="button" value="IE" onclick="javascript:gotoSubmit8_2(event)"/>
...
<script language="javascript">
function gotoSubmit8_2(evt) {
...
evt=evt?evt:(window.event?window.event:null);
alert(evt); //use evt
...
}
</script>

9.event.x与event.y问题

说明:IE下,even对象有x,y属性,但是没有pageX,pageY属性;Firefox下,even对象有pageX,pageY属性,但是没有x,y属性.
解决方法:使用mX(mX = event.x ? event.x : event.pageX;)来代替IE下的event.x或者Firefox下的event.pageX.

10.event.srcElement问题

说明:IE下,even对象有srcElement属性,但是没有target属性;Firefox下,even对象有target属性,但是没有srcElement属性.
解决方法:使用obj(obj = event.srcElement ? event.srcElement : event.target;)来代替IE下的event.srcElement或者Firefox下的event.target.

相关文章

  • layui弹出框Tab选项卡的示例代码

    layui弹出框Tab选项卡的示例代码

    今天小编就为大家分享一篇layui弹出框Tab选项卡的示例代码,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2019-09-09
  • js实现自动轮换选项卡

    js实现自动轮换选项卡

    这篇文章主要为大家详细介绍了js实现自动轮换选项卡,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-01-01
  • Js控制弹窗实现在任意分辨率下居中显示

    Js控制弹窗实现在任意分辨率下居中显示

    弹窗居中比较烦人的是怎么才能在任意分辨率下实现居中显示,为了解决此问题,本文测试了一下案例在此与大家分享,有类似需求的朋友可以学习下
    2013-08-08
  • 获取中文字符串的实际长度代码

    获取中文字符串的实际长度代码

    某些情况下我们需要获取中文字符串的实际长度,下面有个示例,大家可以参考下
    2014-06-06
  • js模拟滤镜的图片渐显效果

    js模拟滤镜的图片渐显效果

    js模拟滤镜的图片渐显效果...
    2007-02-02
  • JavaScript中闭包的写法和作用详解

    JavaScript中闭包的写法和作用详解

    本文给大家介绍javascript中的闭包,包括对js闭包概念的理解,闭包的几种写法和用法,闭包的主要作用,闭包与this对象,闭包与内存泄露及使用闭包的注意点相关知识,非常不错,具有参考借鉴价值,感兴趣的朋友一起学习吧
    2016-06-06
  • Eval and new funciton not the same thing

    Eval and new funciton not the same thing

    以前有人会说,new Function的方式是几乎与eval相等,今天我查了一下,确实是不同的东西,说这句话的人太不负责了。关于eval和new function,得到的结果都是一致的,都会叫你不要去使用它们。所以结论就是“不得不”才使用
    2012-12-12
  • CountUp.js实现数字滚动增值效果

    CountUp.js实现数字滚动增值效果

    这篇文章主要为大家详细介绍了CountUp.js实现数字滚动增值效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2019-10-10
  • 二级域名或跨域共享Cookies的实现方法

    二级域名或跨域共享Cookies的实现方法

    适用于Asp。 在主域名设置的Cookie,在各子域名共用;适用于博客等提供二级域名。这个问题,以网上有众多帖子,可惜都没有完整解决。
    2008-08-08
  • js判断滚动条是否已到页面最底部或顶部实例

    js判断滚动条是否已到页面最底部或顶部实例

    这篇文章主要介绍了js判断滚动条是否已到页面最底部或顶部的原理与方法,以实例的形式详细分析了js实现返回顶部功能所涉及的各种技巧,并对相关知识点进行了总结归纳,需要的朋友可以参考下
    2014-11-11

最新评论