1.事件冒泡

2.事件捕获

事件处理程序

1.HTML事件处理程序

2.DOM 0级事件处理程序

3.DOM 2级事件处理程序     addEventListener(),removeEventListener()

4.IE事件处理程序    attachEvevnt()    detachEvent()

DOM中的事件对象

1.DOM中的事件对象

（1）type属性      获取事件的类型

（2）target属性      用于获取事件的目标

（3）stopPropagation()       阻止事件冒泡

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

2.IE中的事件对象

（1）type属性    用于获取事件的类型

（2）srcElement属性   用于获取事件的目标

（3）cancelBubble属性    阻止事件冒泡  设置为true表示阻止冒泡，设置为false表示不阻止冒泡

（4) rutrunValue属性   设置为false表示阻止事件的默认行为

var eventUtil = {

//添加句柄

addHandler:function(element,type,handler){

if(element.addEventListener){

element.addEventListener(type,handler,false);

}else if(element.attachEvent){

element.attachEvent("on"+type,handler);

}else{

element['on'+type] = handler;

}

},

//删除句柄

removeHandler:function(element,type,handler){

if(element.removeEventListener){

element.removeEventListener(type,handler,false);

}else if(element.detachEvent){

element.detachEvent("on"+type,handler);

}else{

element['on'+type] = handler;

}

},

//事件对象

getEvent:function(event){

return event?event:window.event;

},

//获取事件类型

getType:function(event){

return event.type;

},

//获取事件的目标

getElement:function(event){

return event.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;

}

}

}