JavaScript DOM事件中一些对于浏览器的兼容问题

1、绑定事件处理程序

function addEvent(element,type,func){     if(element.addEventListener){         element.addEventListener(type,func,false);     }else if(element.attachEvent){//兼容IE         element.attachEvent("on"+type,func);     }else{         element["on"+type] = func;     } }

addEventListener是W3C DOM中提供的注册事件监听器的方法，优点在于：

1、我们知道传统的onclick等方法是只能一个事件绑定一个方法，如果绑定多个方法，下一个方法会覆盖上一个方法，只能是最后一个生效，但是使用addEventListener是允许给一个事件注册读个监听器的

2.可以选择冒泡或者捕获两种方式来触发事件，更加精确地控制事件（第三个参数），false为事件冒泡，true为事件捕获

3.对所有的DOM元素都是有效的

attachEvent是兼容IE8及以下版本的注册事件监听方法，而且它只支持事件冒泡

“on”+ type 是在不支持addEventListener和attachEvent的前提下提供的， 最原始的事件绑定方法，兼容所有浏览器

2.移除事件处理程序

function removeEvent(element,type,func){ if(element.removeEventListener){ element.removeEventListener(type,func,false); }else if(element.detachEvent){ element.detachEvent("on"+type,func); }else{ element["on"+type] = false; } }

这个和第一点绑定事件处理是一样的，对照就好

3.取消元素默认行为

function preventDefault(event){ if(event.preventDefault){ event.preventDefault(); }else{ event.returnValue = false; } }

preventDefault是当事件采用了addEventListener的注册监听器的事件使用的取消元素默认行为的方法

returnValue = false是兼容IE的方法

4.获取event的target目标

function getTarget(event){ return event.target||event.srcElement; }

IE支持的是window.event.srcElement，firefox支持的是 window.event.target

5.获取各种位置

event.clientX 和 event.clientY

鼠标相对于浏览器窗口可视区（不包括工具栏和滚动条）的X，Y坐标。IE事件和标准事件都支持

event.pageX 和 event.pageY

不同于event.clientX 和 event.clientY的是他们相对于文档坐标。不是标准属性而且IE事件中没有这两个属性

event.offsetX 和 event.offsetY

鼠标相对于事件源元素（target/srcElement）的X，Y坐标，IE事件有，标准事件中没有

event.screenX 和 event.screenY

鼠标相对于显示器屏幕左上角的X, Y坐标。IE事件和标准事件都支持