IE与FireFox的兼容性问题分析


Posted in Javascript onApril 22, 2007

window.event

IE:有window.event对象 
FF:没有window.event对象。可以通过给函数的参数传递event对象。如onmousemove=doMouseMove(event) 
鼠标当前坐标

IE:event.x和event.y。 
FF:event.pageX和event.pageY。 
通用:两者都有event.clientX和event.clientY属性。 
鼠标当前坐标(加上滚动条滚过的距离)

IE:event.offsetX和event.offsetY。 
FF:event.layerX和event.layerY。 
标签的x和y的坐标位置:style.posLeft 和 style.posTop

IE:有。 
FF:没有。 
通用:object.offsetLeft 和 object.offsetTop。 
窗体的高度和宽度

IE:document.body.offsetWidth和document.body.offsetHeight。注意:此时页面一定要有body标签。 
FF:window.innerWidth和window.innerHegiht,以及document.documentElement.clientWidth和document.documentElement.clientHeight。 
通用:document.body.clientWidth和document.body.clientHeight。 
添加事件

IE:element.attachEvent("onclick", func);。 
FF:element.addEventListener("click", func, true)。 
通用:element.onclick=func。虽然都可以使用onclick事件,但是onclick和上面两种方法的效果是不一样的,onclick只有执行一个过程,而attachEvent和addEventListener执行的是一个过程列表,也就是多个过程。例如:element.attachEvent("onclick", func1);element.attachEvent("onclick", func2)这样func1和func2都会被执行。 
标签的自定义属性

IE:如果给标签div1定义了一个属性value,可以div1.value和div1["value"]取得该值。 
FF:不能用div1.value和div1["value"]取。 
通用:div1.getAttribute("value")。 
父节点、子节点和删除节点

IE:parentElement、parement.children,element.romoveNode(true)。 
FF:parentNode、parentNode.childNodes,node.parentNode.removeChild(node)。 
画图

IE:VML。 
FF:SVG。 
CSS:透明

IE:filter:progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=60)。 
FF:opacity:0.6。 
CSS:圆角

IE:不支持圆角。 
FF:-moz-border-radius:4px,或者-moz-border-radius-topleft:4px;-moz-border-radius-topright:4px;-moz-border-radius-bottomleft:4px;-moz-border-radius-bottomright:4px;。 
CSS:双线凹凸边框

IE:border:2px outset;。 
FF:-moz-border-top-colors: #d4d0c8 white;-moz-border-left-colors: #d4d0c8 white;-moz-border-right-colors:#404040 #808080;-moz-border-bottom-colors:#404040 #808080;。

Javascript 相关文章推荐
asp.net 30分钟掌握无刷新 Repeater
Sep 16 Javascript
利用js实现在浏览器状态栏显示访问者在本页停留的时间
Dec 29 Javascript
利用JQuery制作符合Web标准的QQ弹出消息
Jan 14 Javascript
Jquery实现控件的隐藏和显示实例
Feb 08 Javascript
js图片跟随鼠标移动代码
Nov 26 Javascript
JavaScript检查子字符串是否在字符串中的方法
Feb 03 Javascript
js学习阶段总结(必看篇)
Jun 16 Javascript
详解react-webpack2-热模块替换[HMR]
Aug 03 Javascript
JS简单实现父子窗口传值功能示例【未使用iframe框架】
Sep 20 Javascript
JavaScript实现简单的隐藏式侧边栏功能示例
Aug 31 Javascript
JS实现骰子3D旋转效果
Oct 24 Javascript
详解JavaScript中new操作符的解析和实现
Sep 04 Javascript
javascript生成/解析dom的CDATA类型的字段的代码
Apr 22 #Javascript
XML+XSL 与 HTML 两种方案的结合
Apr 22 #Javascript
用javascript实现的图片马赛克后显示并切换加文字功能
Apr 21 #Javascript
JS Timing
Apr 21 #Javascript
运用Windows XP附带的Msicuu.exe、Msizap.exe来彻底卸载顽固程序
Apr 21 #Javascript
JS 建立对象的方法
Apr 21 #Javascript
如何做到打开一个页面,过几分钟自动转到另一页面
Apr 20 #Javascript
You might like
雄兵连:天使彦天使彦为爱折翼,彦和炙心同时念动的誓言!
2020/03/02 国漫
php 多线程上下文中安全写文件实现代码
2009/12/28 PHP
UCenter 批量添加用户的php代码
2012/07/17 PHP
Yii实现显示静态页的方法
2016/04/25 PHP
php cookie 详解使用实例
2016/11/03 PHP
优秀js开源框架-jQuery使用手册(1)
2007/03/10 Javascript
window.addeventjs事件驱动函数集合addEvent等
2008/02/19 Javascript
javascript 关闭IE6、IE7
2009/06/01 Javascript
jquery imgareaselect 使用利用js与程序结合实现图片剪切
2009/07/30 Javascript
JavaScript通过Date-Mask将日期转换成字符串的方法
2015/06/04 Javascript
Bootstrap如何创建表单
2016/10/21 Javascript
Easyui的组合框的取值与赋值
2016/10/28 Javascript
js时间戳格式化成日期格式的多种方法介绍
2017/02/16 Javascript
完美解决input[type=number]无法显示非数字字符的问题
2017/02/28 Javascript
原生JS实现左右箭头选择日期实例代码
2017/03/14 Javascript
MUI 解决动态列表页图片懒加载再次加载不成功的bug问题
2017/04/13 Javascript
react系列从零开始_简单谈谈react
2017/07/06 Javascript
vue+webpack实现异步组件加载的方法
2018/02/03 Javascript
ElementUI radio组件选中小改造
2019/08/12 Javascript
[14:51]DOTA2 HEROS教学视频教你分分钟做大人-卓尔游侠
2014/06/13 DOTA
[07:25]DOTA2-DPC中国联赛2月5日Recap集锦
2021/03/11 DOTA
Python合并字符串的3种方法
2015/05/21 Python
小小聊天室Python代码实现
2016/08/17 Python
Python中的默认参数实例分析
2018/01/29 Python
Django中cookie的基本使用方法示例
2018/02/03 Python
python3实现elasticsearch批量更新数据
2019/12/03 Python
使用IPython或Spyder将省略号表示的内容完整输出
2020/04/20 Python
PyCharm2019.3永久激活破解详细图文教程,亲测可用(不定期更新)
2020/10/29 Python
Wedgwood英国官方网站:英式精致骨瓷餐具、礼品与生活精品,源于1759年
2019/09/02 全球购物
标记环介质访问控制协议
2016/03/27 面试题
extern是什么意思
2016/03/10 面试题
汽车维修求职信
2014/06/15 职场文书
公司收款委托书范本
2014/09/20 职场文书
小爸爸观后感
2015/06/15 职场文书
学校财务管理制度
2015/08/04 职场文书
2022年显卡天梯图(6月更新)
2022/06/17 数码科技