事件物件
包含事件相關的資訊,如滑鼠、時間、觸發的DOM物件等
js預設將事件物件封裝好,並自動的以引數的形式,傳遞給事件處理函式的第1個引數,如下:
document.getElementsByTagName("div")[0].onclick = function(e){
e = window.event || e; //相容IE低版本(事件物件繫結在window的event上)
console.log(e);//這裡e就是事件物件
}
事件的屬性和方法
type:獲取事件型別(click、mouseover等等)
target:獲取發生的所在元素(在低版本IE下用srcElement屬性)
stopPropagation() 阻止事件冒泡(IE用cancelBubble屬性為false阻止冒泡)
preventDefault() 阻止事件預設行為(IE用returnValue屬性為false阻止預設行為)
事件委託
利用target屬性,獲取時間發生的所在物件,避免全體子元素加事件,對比如下:
var tbs=document.getElementsByTagName("td");
for(var i=0;i<tbs.length;i++){//迴圈給每個子元素新增事件
tbs[i].onclick=function(){
this.style.background="red";
}
}
document.getElementsByTagName("table")[0].onclick=function(e){
e.target.style.background="red";//只繫結父元素事件,用target獲取子元素
}