浏览器兼容问题

在写前端代码的过程中必须要考虑浏览器兼容性问题，很多时候触发一个事件但是结果并不是自己心中想要的结果，可以看一下是否是因为浏览器兼容性问题造成的，下面是一些事件对于浏览器的兼容性。

1、 获取事件对象
①window.event:兼容ie高低版本和谷歌浏览器
②通过方法中的参数传递function(event){ }:兼容IE9+、谷歌和火狐
所以，通常要有一个兼容性的写法：

lis[i].onclick=function(event){
    event=event||window.event;
}

2、获取事件源
①event.srcElement:兼容谷歌浏览器
②event.target:兼容火狐浏览器
兼容性写法：

var src=event.srcElement||event.target;

3、 滚轮事件
当页面高度的值很大时，就会出现滚动条，所以scrollTop和scrollLeft(这两个都是属性，而不是方法)分别是用来获取浏览器上下滚动的高度和浏览器左右滚动的高度，但是这个有兼容性问题。
①谷歌浏览器是从body上去拿：document.body.scrollTop
②火狐浏览器、IE是从documentElement上去拿：document.documentElement.scrollTop
③ie9+浏览器是从pageOffset上面去拿：document.pageOffset.scrollTop
兼容写法：

document.body.scrollTop||document.documentElement.scrollTop||document.pageOffset.scrollTop||0;

4、onresize事件
onresize事件是在窗体大小被改变的时候被触发，window对象支持onresize事件，同时常规标签也都支持（div、textarea、table等）
①兼容谷歌：document.body.clientWidth
②兼容火狐、IE：document.documentElement.clientWidth