IE和firefox浏览器的event事件兼容性怎么样?兼容性详情说明
2024-06-24 10:36:34阅读量:43 字体:大 中 小
1,关于event的用法
存在问题:IE中可以直接使用event对象,但是Mozilla不可以直接使用。
例如:
function doIt(){
alert(event);
}
这段代码在Mozilla浏览器中是不能正常工作的,因为Mozilla浏览器中没有默认的event对象,只能在事件发生的现场使用。

下面看一下两者都兼容的代码:
IE&Moz
function doIt(oEvent){
alert(oEvent);
}
2,关于event.srcElement[IE]和event.target[Moz]
Mozilla下的e.target相当于ie下的event.srcElement,但细节上有区别,后者是返回一个Html Element
而e.target返回的是个节点,也就是说包括文本节点。
看下面的例子代码,可以看出两者的区别和联系:
IE ONLY
| 1 | 2 |
| 3 | 4 |
function doIt(){ alert(event.srcElement.tagName); }
Moz
| 1 | 2 |
| 3 | 4 |
function doIt(oEvent){
var Target = oEvent.target;
while(oTarget.nodeType != 1)
Target = oTarget.parentNode;
alert(oTarget.tagName);
}
3,键盘值的取得
Mozilla下的event.which与IE下的event.keyCode相当。
见代码:
IE
Moz
4,event.x,event.y[IE]和event.pageX,event.pageY[Moz]
IE中取鼠标点击的绝对位置,使用event对象的event.x和event.y
Moz中取鼠标点击的绝对位置,使用event对象的event.pageX和event.pageY
所以为了兼容,需要自己做处理,参考代码如下:
IE&Moz
5,event.offsetX,event.offsetY[IE]和event.pageX,event.pageY[Moz]
IE中取鼠标点击的相对位置,使用event对象的event.offsetX和event.offsetY
Moz中取鼠标点击的相对位置,使用event对象的event.layerX和event.layerY
所以为了兼容,需要自己做处理,参考代码如下:
IE&Moz
6,事件绑定
事件绑定上Mozilla用addEventListener,removeEventListener
对应IE的attachEvent,detatchEvent
看下面的例子代码:
IE ONLY
Moz
注意:蓝色字的部分。IE中要在事件前加on,而在Moz中不能加。
对象选择篇
1,通过ID访问Html元素
一般直接使用document.getElementById就可以了,如果要兼容IE4,可以再加上document.all
IE&Moz
2,如果要使用document.form.item类似的访问方法,要注意下面的问题:
IE中允许存在类似于 document.formName.item("itemName") 这样的语句,但是Moz下是不可以的
要想在Mozilla下也可以正常运行,需要把写法正规化,如下:
IE&Moz
注意:在Mozilla中,访问数组的时候,不能用类似于arr("itemName")的形式,必须使用中括号,而在IE中两者都可以。
另外,在写上面这段测试代码的时候,我发现了Mozilla浏览器的一个有趣的问题,不知道是不是Bug。大家可以试一下下面这段代码:
Moz
Moz
个人认为可能是因为Mozilla太符合Dom标准了吧
DOM篇
1,删除节点
IE中有removeNode方法,可以对节点进行删除,如下:
IE
document.getElementById("myButton").removeNode();
但是Mozilla中,没有这个方法,只能是先找到父节点,然后调用Dom方法removeChild才可以达到目的,如下:
IE&Moz
var Node = document.getElementById("myButton");
oNode.parentNode.removeChild(oNode);
2,交换节点
IE中有swapNode方法可以交换两个HTML元素节点,如下:
IE
但是Mozilla中,没有这个方法,可以自己写函数实现,如下:
IE&Moz
3,关于节点的插入
IE中,有insertAdjacentHTML和insertAdjacentElement两个好用的方法,如下:
IE
但是Mozilla中是没有这两个方法的,为了兼容它们,统一采用Dom的insertBefore方法,如下:
IE&Moz
var Div = document.getElementById("div1");
var Element = document.createElement("input");
oElement.type = "text";
oDiv.insertBefore(oElement,null);
4,关于innerHTML和innerText
对于innerHTML,IE和Mozilla都是支持的,所以没什么问题,但是对于innerText,只有IE有,Moz是没有的
免责声明:
本文《IE和firefox浏览器的event事件兼容性怎么样?兼容性详情说明》版权归原作者所有,内容不代表本站立场!
如本文内容影响到您的合法权益(含文章中内容、图片等),请及时联系本站,我们会及时删除处理。
推荐阅读

vivos12分屏模式怎么开启
vivos12手机的系统自带有分屏的功能,有需要的用户可以开启手机的分屏模式,具体的操作步骤如下: vivos12分屏模式怎么开启 1、打开手机,用手指从手机屏幕的底部向上滑动,这一过程中手指不要松开...
阅读: 962

苹果睡眠起床闹钟删不掉
苹果手机系统有一个睡眠起床闹钟的功能,这个闹钟是无法删除的,但是可以进行关闭,操作步骤如下: 苹果睡眠起床闹钟删不掉 1、打开手机的时钟app,进入下方的闹钟”界面。 2、点击起床闹钟的...
阅读: 795

怎么把小红书的视频提取出来
小红书的视频可以通过保存视频的方式提取到手机上,小红书通过保存提取视频的具体步骤如下: 怎么把小红书的视频提取出来 1、打开小红书app,然后选择需要提取的视频。 2、选择需要提取的视频后,选择右上...
阅读: 1857

抖音可以注销了重新注册吗
抖音注销了可以重新注册,抖音账号注销后,一般需要两个星期过后才可以重新注册账号。具体的操作方式如下: 抖音可以注销了重新注册吗 1、打开抖音,点击进入我”的界面。 2、进入我&rdquo...
阅读: 846

美团异地怎么点外卖给别人
美团异地可以通过修改收货地址的方法来给别人点外卖,修改收货地址给别人点外卖的具体操作步骤如下: 美团异地怎么点外卖给别人 1、打开美团app,在首页上方点击外卖进入外卖界面。 2、进入外卖界面后,点...
阅读: 876

支付宝悄悄话怎么知道对方看没看
支付宝的悄悄话是阅后即焚的消息,如果发送悄悄话过去,悄悄话消失了就证明对方已看。具体操作方法如下: 支付宝悄悄话怎么知道对方看没看 1、打开手机支付宝app,点击消息”,再点击右上角人像。...
阅读: 1664
热门文章
1.支付宝买彩票在网上怎么买
- 1

- 支付宝买彩票在网上怎么买
- 2022-12-31
- 1
2.QQ等待验证是不是拉黑了
- 2

- QQ等待验证是不是拉黑了
- 2022-12-27
- 2
3.360隐私空间里面的照片怎么找回
- 3

- 360隐私空间里面的照片怎么找回
- 2022-12-27
- 3
4.支付宝提现免费额度在哪查询
- 4

- 支付宝提现免费额度在哪查询
- 2022-12-27
- 4
5.个人收款二维码去哪里制作
- 5

- 个人收款二维码去哪里制作
- 2022-12-27
- 5
6.怎么看微信绑定了几个账号
- 6

- 怎么看微信绑定了几个账号
- 2022-12-27
- 6
7.快手聚星怎么开通
- 7

- 快手聚星怎么开通
- 2022-12-27
- 7
8.剪映贴纸怎么跟着遮挡部位走
- 8

- 剪映贴纸怎么跟着遮挡部位走
- 2022-12-27
- 8
9.没有京东白条怎么分期买手机
- 9

- 没有京东白条怎么分期买手机
- 2022-12-27
- 9
10.换新手机微信登录不上去怎么办
- 10

- 换新手机微信登录不上去怎么办
- 2022-12-27
- 10
最近更新

酷狗音乐中使用蝰蛇音效制作工具的具体操作方法
2024-11-11

win7电脑中出现声音图标不见了的具体解决方法
2024-11-11

车到哪app的详细软件介绍
2024-11-11

小米9se中查看序列号的具体操作方法
2024-11-11

迅雷中使用FTP探测器的详细操作方法
2024-11-11

ppt制作出小荷才露尖尖角动画场景的具体操作步骤
2024-11-11
