谈谈JavaScript中浏览器兼容问题的写法小议

前端之家收集整理的这篇文章主要介绍了谈谈JavaScript中浏览器兼容问题的写法小议前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

前言

JavaScript中很多坑,其中对浏览器的兼容也是一个问题,本文就简略的归纳了部分针对浏览器兼容问题的写法的例子,旨在便于查找。如果读者有什么好的意见建议,请留言交流,谢谢!

window窗口大小

1.在IE9+、Chrome、Firefox、Opera以及Safari中

window.innerHeight获取浏览器窗口的内部高度

window.innerWidth获取浏览器窗口的内部宽度

2.在IE5/6/7/8(Chrome和Firefox也支持

document.documentElement.clientHeight

document.documentElement.clientWidth

3.兼容写法(可以涵盖所有的浏览器)

就是把前两者的写法相 “或”。

获取内部样式表和外部样式表

1.对IE浏览器:对象.currentStyle[“属性名”]

2.其他浏览器:window.getComputedStyle(对象, null)[“属性名”]

注意:内部样式表中的属性和外部样式表中的属性只能获取不能修改。如果想修改需要通过行间样式表修改,行间样式表的优先级最高,会覆盖内部样式表和外部样式表。

为了简化书写和兼容浏览器,一般封装一个方法。如下列。

Box1">

onscroll事件

事件对象

Box.onclick = function(event) { event = event || window.event; console.log("offsetX:" + event.offsetX + " offsetY:" + event.offsetY); console.log("screenX:" + event.screenX + " screenY:" + event.screenY); console.log("clientX:" + event.clientX + " clientY:" + event.clientY); console.log("pageX:" + event.pageX + " pageY: " + event.pageY); }

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程之家。

猜你在找的JavaScript相关文章