我們在瀏覽網頁時，點擊鼠標或者按下鍵盤時泼差，網頁需要給我們一個相應的事件断序，而這種相應事件就是JavaScript與HTML進行交互纺腊，JavaScript是通過事件與HTML進行交互的。
JavaScript中事件有很多種娶靡，我們這里就直接把他包裝成一個對象牧牢，方便以后兼容的調用。
<p>示例文字</p>
<script>
var eventUtil={
//事件監(jiān)聽
addHandler:function(element,type,handler){
if(element.addEventListener){
element.addEventListener(type,handler,false);//標準瀏覽器規(guī)范
}else if(element.attachEvent){
element.attachEvent('on'+type,handler);//兼容老版IE
}else{
element['on'+type]=handler;
}
},
// 刪除事件監(jiān)聽
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]=null;
}
},
//獲取事件
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;
}
}
}
var p = document.getElementsByTagName("p")[0];
p.onclick = function(e){
console.log(eventUtil.getElement(e));
console.log(eventUtil.getEvent(e));
console.log(eventUtil.getType(e));
}
</script>
