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属性为读写。
解决方法:可以创建两个输入框,比如平时咱们有密码框,想通过把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兼用性的更多相关文章
- JS兼用IE8的通过class名获取CSS对象组
转自:Garon_InE 原生js方法“document.getElementsByClassName”在ie8及其以下浏览器中不能使用,所以写了一个兼容IE的方法. 完整的页面代码如下: testJ ...
- js 获取data-属性值
].getAttribute('data-price'); 注意 document.getElementsByClassName('1pc_price')后面有[0],不然会报错.
- 前端数据可视化echarts.js使用指南
一.开篇 首先这里要感谢一下我的公司,因为公司需求上面的新颖(奇葩)的需求,让我有幸可以学习到一些好玩有趣的前端技术,前端技术中好玩而且比较实用的我想应该要数前端的数据可视化这一方面,目前市面上的数据 ...
- e2e 自动化集成测试 架构 实例 WebStorm Node.js Mocha WebDriverIO Selenium Step by step (三) SqlServer数据库的访问
上一篇文章“e2e 自动化集成测试 架构 京东 商品搜索 实例 WebStorm Node.js Mocha WebDriverIO Selenium Step by step 二 图片验证码的识别” ...
- js基础01
常见的五大浏览器:chrome firfox ie opera safari 浏览器的解析器会把代码解析成用户所能看到的东西 www.2cto.com/kf/201202/118111.html浏览器 ...
- 使用js做创建图片及删除图片 若有什么不对或不完整的地方,请大家提出来,谢谢
首先我们要在<body>中创建一个按钮<button>来用作点击创建图片,在<button>中写一个点击事件(随便命名), 在创建一个<div>存放图片 ...
- 前端数据可视化echarts.js
一.echarts.js的优势与总体情况 echarts.js作为国内的IT三巨头之一的百度的推出一款相对较为成功的开源项目,总体上来说有这样的一些优点 1.容易使用 echarts.js的官方文档比 ...
- 爬虫破解js加密(一) 有道词典js加密参数 sign破解
在爬虫过程中,经常给服务器造成压力(比如耗尽CPU,内存,带宽等),为了减少不必要的访问(比如爬虫),网页开发者就发明了反爬虫技术. 常见的反爬虫技术有封ip,user_agent,字体库,js加密, ...
- js创建类(封装)
js如何创建类(封装) 学过其他面向对象语言的JavaScripter,可能都应用过类,如:class{},等定义的一系列方法, 但是初学者看是学习js的时候,经常会看到这样一句话,那就是Ja ...
随机推荐
- JavaSE入门学习12: Java面相对象之static使用方法
我们能够基于一个类创建多个该类的对象,每一个对象都拥有自己的成员,互相独立. 然而在某些时候,我们更希 望该类全部的对象共享同一个成员. 此时就是static大显身手的时候了. Java中被stati ...
- 【bzoj1196】[HNOI2006]公路修建问题
二分答案 验证有一种贪心的思想,就是如果这条路的c1比二分的值还小,那就要果断选择一级公路. 搜过一遍后,如果可供选择的一级公路小于k,就可以直接返回否了. 接下来继续选择,如果可以选到n-1条路,就 ...
- 异步POST请求解析JSON
异步POST请求解析JSON 一.创建URL NSURL *url = [NSURL URLWithString:@"http://localhost:8080/MJServer/order ...
- YTU 2769: 结构体--成绩统计
2769: 结构体--成绩统计 时间限制: 1 Sec 内存限制: 128 MB 提交: 1021 解决: 530 题目描述 建立一个简单的学生信息表,包括:姓名.性别.年龄及一门课程的成绩,统计 ...
- bzoj1061&&bzoj3256
http://www.lydsy.com/JudgeOnline/problem.php?id=1061 单纯形... 先开始我不知道对偶,看着代码不知所措,并不能懂他们写的是什么... 单纯形的标准 ...
- C# MySql Select
MySqlCommand objCmd = new MySqlCommand("select * from `main_db`.`t_realdailyinfo` ", objCo ...
- codevs3287货车运输(最小生成树+LCA)
3287 货车运输 2013年NOIP全国联赛提高组 时间限制: 1 s 空间限制: 128000 KB 题目等级 : 钻石 Diamond 题目描述 Description A 国有 ...
- P2533 [AHOI2012]信号塔
传送门 据说是一个叫做随机增量法的东西 枚举\(i\),如果不在圆中将它设为圆心 枚举\(j\),如果不在圆中将\((i,j)\)成为新的圆的直径 枚举\(k\),如果不在圆中让\(i,j,k\)组成 ...
- Entity Framework 4.3 中使用存储过程
尽管 Entity Framework 4.3 都已经发布了,且表示在 EF 5 中性能将会有很大提升.但很多存储过程控,始终不会放弃使用存储过程,那今天就让我们看看在 EF 4.3 中怎么使用存储过 ...
- 虚拟机下安装VM
Linux(CentOS 7)命令行模式安装VMware Tools 详解 [日期:2017-05-02] 来源:Linux社区 作者:Linux [字体:大 中 小] 本篇文章主要介绍了如何在Li ...