//定义一个EventUtil对象varEventUtil={//兼容浏览器注册事件处理程序addHandler:function(element,type,handler){//该方法接受3个参数:要操作的元素,事件名称和事件处理程序函数if(element.addEventListener){//检查传入的元素是否存在DOM2级方法element.addEventListener(type,handler,false);//若存在,则使用该方法}elseif(element.attachEvent){//如果存在的是IE的方法element.attachEvent("on"+type,handler);//则使用IE的方法,注意,这里的事件类型必须加上"on"前缀。}else{//最后一种可能是使用DOM0级element["on"+type]=hander;}},//兼容浏览器取消事件处理程序removeHandler:function(element,type,handler){//该方法是删除之前添加的事件处理程序if(element.removeEventListener){//检查传入的元素是否存在DOM2级方法element.removeEventListener(type,handler,false);//若存在,则使用该方法}elseif(element.detachEvent){//如果存在的是IE的方法element.detachEvent("on"+type,handler);//则使用IE的方法,注意,这里的事件类型必须加上"on"前缀。}else{//最后一种可能是使用DOM0及方法(在现代浏览器中,应该不会执行这里的代码)element["on"+type]=null;}},//兼容浏览器获取浏览器事件对象的程序getEvent:function(event){returnevent?event:window.event;},//兼容浏览器获取事件来自哪个元素的程序getElement:function(event){returnevent.target||event.srcElement;},//兼容浏览器阻止事件默认行为preventDefault:function(event){if(event.preventDefault){event.preventDefault();}else{event.returnValue=false;}},//兼容浏览器阻止事件冒泡行为stopPropagation:function(event){if(event.stopPropagation){event.stopPropagation();}else{event.cancelBubble=true;}}}//下面是简单的使用上面的封装对象window.onload=function(){varhtmlobj=document.documentElement;varbodyobj=document.body;varalinkobj=document.getElementById('alink');EventUtil.addHandler(bodyobj,'click',function(){alert("我是body元素");});EventUtil.addHandler(alinkobj,'click',function(){alert("我是alink元素");});EventUtil.addHandler(alinkobj,'click',function(e){e=event||window.event;alert(EventUtil.getElement(e));});EventUtil.addHandler(alinkobj,'click',function(e){e=event||window.event;alert(e.type);});EventUtil.addHandler(alinkobj,'click',function(e){e=event||window.event;EventUtil.preventDefault(e);});EventUtil.addHandler(alinkobj,'click',function(e){e=event||window.event;EventUtil.stopPropagation(e);});}

(1)DOM中的事件对象

常用属性:

type: 代表事件的类型

target: 代表事件的实际目标

currentTarget:其事件处理程序当前正在处理事件的那个元素。

重要属性方法:

stopPropagation()阻止事件冒泡

preventDefault()阻止事件的默认行为


(2)IE中的事件对象

常用属性:

type属性 代表事件的类型

srcElement属性代表获取事件的实际目标(类似与DOM中的target)

cancelBubble属性用于阻止事件冒泡,默认值为false,表示不阻止冒泡,true为阻止事件冒泡(与DOM中的stopPropagation()方法相同),

returnValue属性用于阻止默认事件的行为,默认值为true,设置为false就可以取消事件的默认行为(与DOM中的preventDefault()方法相同)。