文档章节

JavaScript在IE浏览器和Firefox浏览器中的差异

green001
 green001
发布于 2013/12/26 20:22
字数 917
阅读 185
收藏 24

JavaScript在IE浏览器和Firefox浏览器中存在一些差异,以下对这些差异部分进行了总结,以及解决方案: 

1.HTML对象的 id 作为对象名的问题 

IE:HTML 对象的 ID 可以作为 document 的下属对象变量名直接使用 

Firefox:不支持

解决方法:使用document.getElementById替代document.all

2.如果控件只有name,没有id, 用getElementById时

IE:可以找到对象 

Firefox:返回NULL

解决方法:所有控件必须设置ID属性

3.Eval

IE:支持,利用 eval(idName) 可以取得 id 为 idName 的 HTML 对象

Firefox:不支持

解决方法:统一使用getElementById(idName) 代替 eval(idName)

4.Event

IE:用全局对象window.event

Firefox:event只能在事件发生的现场使用,在调用函数时传入event对象

解决方法:使用之前做一下浏览器类型判断,各用各的

5.对象名称中美元符号‘$’ 改为使用下划线‘_’ 

6.集合类对象问题

IE:可以使用()或[]获取集合类对象

Firefox:只能使用[]获取集合类对象

现有代码中存在许多,不能在 Firefox 下运行 

解决方法:统一使用[]获取集合类对象。document.form.item(“itemName”) 这样的语句改为document.form.elements["elementName"]

7.变量名与某 HTML 对象 id 相同的问题

IE:不能使用与 HTML 对象 id 相同的变量名

Firefox:可以使用 

解决方法:在声明变量时,一律加上 var ,以避免歧义,这样在 IE 中亦可正常运行。此外,最好不要取与 HTML 对象 id 相同的变量名,以减少错误

8.Event定位问题

IE:支持event.x 和event.y

Firefox:支持event.pageX和event.pageY

解决方法,统一使用event.clientX和event.clientY,但是在Firefox中event.clientX 与 event.pageX 有微妙的差别(当整个页面有滚动条的时候),不过大多数时候是等效的。如果要完全一样,可以判断浏览器类型后对应使用

9.父结点的问题

IE:parentElement parentElement.children

Firefox:parentNode parentNode.childNodes 

childNodes的下标的含义在IE和Firefox中不同,Firefox使用DOM规范,childNodes中会插入空白文本节点。一般可以通过node.getElementsByTagName()来回避这个问题。

当html中节点缺失时,IE和Firefox对parentNode的解释不同。例如: 

1
2
3
4
5
<          form          >
              <          table          >
                  <          input          />
              </          table          >
</          form          >

IE:input.parentNode的值为空节点

Firefox:input.parentNode的值为form 

解决方法:Firefox中节点没有removeNode方法,必须使用如下方法 node.parentNode.removeChild(node) 

10.const 问题

IE:不支持 const 关键字。如 const constVar = 32; 在IE中这是语法错误

Firefox:支持

解决方法:不使用 const ,以 var 代替

11.body 对象

IE:在body标签完全被读入之后才存在

Firefox:在body标签没有被浏览器完全读入之前就存在

12.自定义属性问题

IE:可以使用获取常规属性的方法来获取自定义属性,也可以使用getAttribute()获取自定义属性 

Firefox:只能使用getAttribute()获取自定义属性

解决方法:统一通过getAttribute()获取自定义属性

13.event.srcElement问题

IE:even.srcElement

Firefox:even.target

解决方法:使用时判断浏览器类型,各用各的

14.模态和非模态窗口

IE:支持模态和非模态窗口

Firefox:不支持

解决方法:直接使用window.open(pageURL,name,parameters)方式打开新窗口。如果需要将子窗口中的参数传递回父窗口,可以在子窗口中使用window.opener来访问父窗口

15.innerText

IE:innerText

Firefox:textContent

16.类似 obj.style.height = imgObj.height 的语句

IE:有效

Firefox:无效

解决方法:统一使用obj.style.height = imgObj.height + ‘px’;


本文转载自:http://www.bairuiw.com/front-end-skill/3903.html

green001
粉丝 9
博文 15
码字总数 3514
作品 0
成都
私信 提问
Firefox和IE之间7个JavaScript的差异

尽管 JavaScript 历史上使用冗长而令人生厌的代码块来标的特定浏览器的时期已经结束了,但是偶尔使用一些简单的代码块和对象检测来确保一些代码在用户机器上正常工作依然是必要的。 这篇文章...

asurann
2010/01/26
101
0
Firefox和IE之间7个JavaScript的差异

尽管 JavaScript 历史上使用冗长而令人生厌的代码块来标的特定浏览器的时期已经结束了,但是偶尔使用一些简单的代码块和对象检测来确保一些代码在用户机器上正常工作依然是必要的。 这篇文章...

crazyinsomnia
2010/01/21
517
1
兼顾性能和兼容体验:HTML5时代的浏览器全面测试

  导言:自1981年IBM推出第一台PC以来,桌面电脑以及随后不断涌现的笔记本、平板以及智能手机等设备越来越普及,而近20年来互联网的出现和高速发展,则让浏览器成为这些设备上使用率最高的...

想你一起
2012/11/20
365
7
高效 JavaScript 单元测试

简介: 能在一个浏览器上运行的 JavaScript 并不一定能在其他浏览器上运行。如果没有对代码进行单元测试,那么在决定升级或支持新浏览器的时候,组织就需要花钱测试或重新测试 Web 应用程序。...

鉴客
2011/11/29
401
0
高效 JavaScript 单元测试(转自IBM dev)

自动化 JavaScript 代码跨浏览器测试 Hazem Saleh, 高级软件工程师, IBM 简介: 能在一个浏览器上运行的 JavaScript 并不一定能在其他浏览器上运行。如果没有对代码进行单元测试,那么在决定...

Sam_yi
2011/12/02
345
0

没有更多内容

加载失败,请刷新页面

加载更多

debian10使用putty配置交换机console口

前言:Linux的推广普及,需要配合解决实际应用方能有成效! 最近强迫自己用linux进行实际工作,过程很痛苦,还好通过网络一一解决,感谢各位无私网友博客的帮助! 系统:debian10 桌面:xfc...

W_Lu
34分钟前
10
0
aelf Enterprise 0.8.0 beta有奖公测,“Bug奖金计划”重磅开启

2019年9月30日,aelf Enterprise 0.8.0 beta版正式发布。aelf Enterprise 0.8.0 beta是一个完备的区块链系统, 包含完备的区块链系统、开发套件、开发文档、以及配套的基础应用和基础服务。 ...

AELF开发者社区
36分钟前
8
0
oracle 初始化数据库脚本

create user lpf identified by 123456; create tablespace lpf_ts_cms datafile '/opt/app/oracle/product/11.2.0/lpf.dbf' size 200M; alter user lpf default tablespace lpf_ts_cms; sel......

internetafei
40分钟前
6
0
《区块链DAPP开发入门、代码实现、场景应用》笔记1——天外飞仙DAPP

Solidity编程语言解决了编写智能合约的不友好的问题,但是当合约编译并部署之后,对与这些接口的访问,对于一般的使用者来说,门槛有点高, 对普通用户来说也是非常不友好,为了使广大用户理...

柯南和由美
45分钟前
6
0
流程图制作软件推荐_流程图制作软件哪个好

流程图(Flow Chart)是一种表示算法思路的图示,通过特定图形、图表可以直观的说明某一过程。这种过程既可以是生产线上的工艺流程图,也可以标明某项任务必需的管理过程。为了便于识别,绘制...

工具分享
47分钟前
7
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部