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属性为读写。
解决方法:可以创建两个输入框,比如平时咱们有密码框,想通过把type为password的值改为text,IE下是不允许的。

8、 window.event问题
说明:window.event只能在IE下运行,而不能在Firefox下运行,这是因为Firefox的event只能在事件发生的现场使用。Firefox必须从源处加入event作参数传递。IE忽略该参数,用window.event来读取该event。
解决方法: var e = e || window.event;

9、event.x与event.y问题
说明:IE下,even对象有x,y属性,但是没有pageX,pageY属性;Firefox下,even对象有pageX,pageY属性,但是没有x,y属性。
解决方法:使用var x = e.x ? e.x : e.pageX; 来代替IE下的event.x或者Firefox下的e.pageX;

10、event.srcElement问题
说明: IE下,event对象有srcElement属性,但是没有target属性;Firefox下,even对象有target属性,但是没有srcElement属性。
解决方法:使用obj(obj = event.srcElement ? event.srcElement : event.target;)来代替IE下的event.srcElement或者Firefox下的event.target,请同时注意event的兼容性问题。

11、body问题
说明:Firefox的body在body标签没有被浏览器完全读入之前就存在;而IE的body则必须在body标签被浏览器完全读入之后才存在。

12、firefox与IE的父元素(parentElement)的区别
说明:IE支持parentElement和parentNode获取父节点,而FF只能使用后者。
解决方法:统一使用parentNode;

13、innerText问题
说明:innerText在IE中能正常工作,但是innerText在FireFox中却不行. 需用textContent。
解决方法:elem.innerText = elem.textContent = “值”

14、样式单位问题
说明:FireFox中设置HTML标签的style时,所有位置性和字体尺寸的值必须后跟px。这个ie也是支持的。
15、样式关键字冲突问题
说明:CSS属性与JavaScript中的保留关键字命名相同,IE中style+属性,非IE中css+属性。

16、class属性冲突问题
说明:class属性冲突,class是javascript中的保留关键字。

17、年份获取问题
说明:使用getFullYear替换getYear。

18、for属性冲突问题
说明:lable标签的属性for冲突,在IE浏览器中getAttribute(“htmlFor”),在非IE浏览器中getAttribute(“for”)。
19、removeChild和removeNode的问题
说明:appendNode在IE和Firefox下都能正常使用,但是removeNode只能在IE下用,FF支持removeChild。

20、事件监听函数的问题
说明:标准浏览器的写法addEventListener()和IE的写法attachEvent()。
解决方法:判断addEventListener是否存在,如果存在则用否则用IE8以下的版本(含IE8)的绑定方法attachEvent,removeEventListener()和detachEvent()也是一样的用法。

21、阻止事件冒泡
说明: stopPropagation()和cancelBubble,前者是方法,是标准的写法,后者是属性,赋值true表示阻止,是IE的写法。
解决方法:判断stopPropagation是否存在,如果存在则用标准写法否则则用IE的写法,不可反过来判断。
22、阻止默认事件
说明: preventDefault()和returnValue()前者标准写法,后者IE写法。
解决方法:一般情况建议直接使用return false阻止,但和取消默认事件的含义是不同的。

js兼用性的更多相关文章

  1. JS兼用IE8的通过class名获取CSS对象组

    转自:Garon_InE 原生js方法“document.getElementsByClassName”在ie8及其以下浏览器中不能使用,所以写了一个兼容IE的方法. 完整的页面代码如下: testJ ...

  2. js 获取data-属性值

    ].getAttribute('data-price'); 注意 document.getElementsByClassName('1pc_price')后面有[0],不然会报错.

  3. 前端数据可视化echarts.js使用指南

    一.开篇 首先这里要感谢一下我的公司,因为公司需求上面的新颖(奇葩)的需求,让我有幸可以学习到一些好玩有趣的前端技术,前端技术中好玩而且比较实用的我想应该要数前端的数据可视化这一方面,目前市面上的数据 ...

  4. e2e 自动化集成测试 架构 实例 WebStorm Node.js Mocha WebDriverIO Selenium Step by step (三) SqlServer数据库的访问

    上一篇文章“e2e 自动化集成测试 架构 京东 商品搜索 实例 WebStorm Node.js Mocha WebDriverIO Selenium Step by step 二 图片验证码的识别” ...

  5. js基础01

    常见的五大浏览器:chrome firfox ie opera safari 浏览器的解析器会把代码解析成用户所能看到的东西 www.2cto.com/kf/201202/118111.html浏览器 ...

  6. 使用js做创建图片及删除图片 若有什么不对或不完整的地方,请大家提出来,谢谢

    首先我们要在<body>中创建一个按钮<button>来用作点击创建图片,在<button>中写一个点击事件(随便命名), 在创建一个<div>存放图片 ...

  7. 前端数据可视化echarts.js

    一.echarts.js的优势与总体情况 echarts.js作为国内的IT三巨头之一的百度的推出一款相对较为成功的开源项目,总体上来说有这样的一些优点 1.容易使用 echarts.js的官方文档比 ...

  8. 爬虫破解js加密(一) 有道词典js加密参数 sign破解

    在爬虫过程中,经常给服务器造成压力(比如耗尽CPU,内存,带宽等),为了减少不必要的访问(比如爬虫),网页开发者就发明了反爬虫技术. 常见的反爬虫技术有封ip,user_agent,字体库,js加密, ...

  9. js创建类(封装)

    js如何创建类(封装)     学过其他面向对象语言的JavaScripter,可能都应用过类,如:class{},等定义的一系列方法, 但是初学者看是学习js的时候,经常会看到这样一句话,那就是Ja ...

随机推荐

  1. 练习使用Trim()函数规范名字输入

    Java中的Trim()函数能够去除字符串的空白前缀和空白后缀,可用来规范用户输入的内容,详细这样用: String s="   Hello world  ".trim(); 然后 ...

  2. bzoj 2217 Lollipop

    题目大意: 有一个长度为n的序列a1,a2,...,an.其中ai要么是1("W"),要么是2("T") 现在有m个询问,每个询问是询问有没有一个连续的子序列, ...

  3. LIBTOOL is undefined 问题的解决方法

    configure.ac:10: error: possibly undefined macro: AC_PROG_LIBTOOL If this token and others are legit ...

  4. 【转载】深入理解Linux文件系统

      1.rm-rf删除目录里的文件后,为什么可以恢复? 首先创建一个空目录test,目录的blocksize为4096字节 为了空目录还是4096?首先,目录的大小取决它所包含的文件的inode(访问 ...

  5. php的类型转换

    转自:http://www.tianzhigang.com/article.asp?id=280 PHP的数据类型转换属于强制转换,允许转换的PHP数据类型有: (int).(integer):转换成 ...

  6. keystone身份认证服务

    Keystone介绍 keystone 是OpenStack的组件之一,用于为OpenStack家族中的其它组件成员提供统一的认证服务,包括身份验证.令牌的发放和校验.服务列表.用户权限的定义等等.云 ...

  7. Codeforces 792C

    题意:给出一个由0到9数字构成的字符串,要求删去最少的数位,使得这个字符串代表的数能被3整除,同时要求不能有前导零,并且至少有一位(比如数字11,删去两个1后就没有数位了,所以不符合).如果能够处理出 ...

  8. c# regex Match Matches MatchCollection 用法

    string text = "1A 2B 3C 4D 5E 6F 7G 8H 9I 10J 11Q 12J 13K 14L 15M 16N ffee80 #800080"; Reg ...

  9. azkaban-executor启动时出现conf/global.properties (No such file or directory)的问题解决(图文详解)

     问题详情 // :: INFO [FlowRunnerManager] [Azkaban] Cleaning recently finished // :: INFO [FlowRunnerMana ...

  10. [转] 64位Oracle 11g R2的客户端连接时报ORA-01019错误

    本文转自:http://blog.csdn.net/downmoon/article/details/8038583 在Win8企业版64位环境下,连接Oracle11g 服务端,搞了整整两天,特将过 ...