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. openstack instance resize Resize error: Unable to resize disk down

  2. linux下 yum相关

    1.1 什么是yum源 Yellowdog Updater, Modified 一个基于RPM包管理的字符前端软件包管理器. 能够从指定的服务器自动下载RPM包并且安装,可以处理依赖性关系,并且一次安 ...

  3. js:正则表达

    一:正则表达对象方法 1:compile()方法   //编译正则表达式 实例:在字符串中全局搜索“man”,并用“person”替换,然后通过compile()方法,改变正则表达式,用person替 ...

  4. Tyvj1305最大子序和(单调队列优化dp)

    描述 输入一个长度为n的整数序列,从中找出一段不超过M的连续子序列,使得整个序列的和最大. 例如 1,-3,5,1,-2,3 当m=4时,S=5+1-2+3=7当m=2或m=3时,S=5+1=6 输入 ...

  5. [Swift通天遁地]二、表格表单-(10)快速添加日期选择/多选/动作表单/地图等自定义表单

    ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★➤微信公众号:山青咏芝(shanqingyongzhi)➤博客园地址:山青咏芝(https://www.cnblogs. ...

  6. linux 查看内存和cpu

    Linux查看CPU和内存使用情况 在系统维护的过程中,随时可能有需要查看 CPU 使用率,并根据相应信息分析系统状况的需要.在 CentOS 中,可以通过 top 命令来查看 CPU 使用状况.运行 ...

  7. PHP入门开发

    1.下载开发工具phpstorm 地址:http://www.jetbrains.com/phpstorm/download/download-thanks.html?platform=windows ...

  8. python自动化测试学习笔记-6urllib模块&request模块

    python3的urllib 模块提供了获取页面的功能. urllib.request.urlopen(url, data=None, [timeout, ]*, cafile=None, capat ...

  9. JavaScript--编程

    第一步:把注释语句注释. 第二步:编写代码,在页面中显示 “系好安全带,准备启航--目标JS”文字: 第三步:编写代码,在页面中弹出提示框“准备好了,起航吧!” 提示: 可以把弹框方法写在函数里. 第 ...

  10. struts2.1.6存在中文乱码的bug

    如题,后续版本中已解决:可以通过添加filter的方式解决.