`
tsailer
  • 浏览: 51440 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类

js IE与FireFox的兼容性问题 事件

    博客分类:
  • JS
阅读更多
# 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)。
    * 因为firefox与IE都支持DOM,因此使用obj.parentNode是不错选择.

# 画图

    * 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;。

来源于http://81146566.blog.163.com/blog/static/26955116200942910822367/

以下内容来源于
http://www.blogjava.net/juliashine/archive/2007/03/29/106982.html

# IE有全局event对象window.event,FF没有,FF中的 event 只能在事件发生的现场使用,即必须通过事件绑定函数的参数来使用。
<input type="text" name="input_content" onkeydown="exeCode(event)"/>

<script language="javascript">
function exeCode() {
  //取得事件对象
  var event = arguments[0] || window.event;
  //取得事件的发生源对象
  var element = event.srcElement || event.target;
}
</script>



# FireFox下没有preserveWhiteSpace这个属性,即:把空白也当作一个节点。而IE则默认为false,即把空白不看成一个节点。所以在FireFox下previousSibling可能是空白节点,除非两个HTML标签之间没有任何形式的空格。


# IE下可以用document.frames("name").document的方式取得frame中所嵌页面的document对象,FF下却会得到null,解决的的办法是document.getElementById(framename).contentWindow.document,也可以使用
window.frames[frameName].document 直接获取frame里的document对象
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics