事件代理學習與總結

     事件代理（Event Delegation），又稱之為事件委托。是 JavaScript 中常用綁定事件的常用技巧。很容易理解這個名稱，“事件代理”即是把原本需要綁定的事件委托給父元素，讓父元素擔當事件監聽的職務。
     事件代理的用處是？對于Javascript，添加到頁面的事件程序數量會直接關系到頁面的整體運行性能，在javascript中每個函數都是對象，都會在內存中占用一定的空間，對象越多性能就越差，還有，DOM操作是十分消耗性能的，添加多個事件就會增多DOM的訪問次數，所以會延遲整個頁面的交互就緒事件。而事件代理的核心思想，就是通過盡量少的綁定，去監聽盡量多的事件。從而達到，從一方面提升性能。

     事件代理核心是：事件冒泡以及目標元素。

     最適合采用事件委托技術的事件有：click,mousedown.mouseup,keydown,keyup,和keypress.

   舉例：建立這樣一個表格，對每一行中的每一列元素，要求點擊后彈出對應的值，為每行添加一個類TR，每列添加一個類為TD，效果圖如下：

window.onload=function(){   	    
	     //沒有使用事件代理，為16個td分別添加點擊事件  
	     var TDObjs=document.getElementsByClassName('TD');//通過類名選出每一行中的每一列
	     for(var i=0;i<TDObjs.length;i++){
	     	 EventUtil.addHandler(TDObjs[i],"click",function(event){//通過for循環為每一行中的每一列添加click事件（注冊16個點擊事件）
	     	     event=event||window.event;
	       	      var target=EventUtil.getElement(event);
	     	      alert(target.innerText);
	     	 	});
	     }
	     //使用事件委托來解決上面為每一個td項增加事件,而改變為每一行tr添加事件，只需要添加4個點擊事件，就可以達到上面的效果	  
	     var TRObjs=document.getElementsByClassName('TR');//獲得表格的行對象
	     for(var i=0;i<TRObjs.length;i++){
	     	//對每一行添加事件程序，進而操作里面的每一個td列（注冊4個點擊事件）
	     	  EventUtil.addHandler(TRObjs[i],"click",function(event){
	     	 event=event||window.event;
	       	 var target=EventUtil.getElement(event);
	       	 //通過switch語句分別對每一行中的每一列就行操作
	       	 switch(target.id){
	       	 	case "td1":
                alert(target.innerText);              
	       	    break;
	       	    case "td2":
	       	    alert(target.innerText);
	       	    break;
	       	     case "td3":
	       	    alert(target.innerText);
	       	    break;
	       	      case "td4":
	       	    alert(target.innerText);
	       	    break;
	       	    case "td5":
	       	    alert(target.innerText);
	       	    break;

                    等等..對列進行的操作
	       	 	   
	       	 }
	       	    });
	     }
	   
	       	    
	       	 	

總結：

      將每一個td上的事件，改到它的父元素上tr上進行注冊監聽，避免了大量的注冊監聽事件，可以稍微提高性能，

這個表格事件委托中，有一個問題：在往上級，用table注冊事件函數，但tr,td無法響應，這個在后期的學習中會留意其真正原理?？傊?，事件委托還是很好的一項技術，利用這樣的思想，在使用事件時，

     （1）盡可能去限制一個頁面中的事件處理程序的數量，數量太多會占用大量的內存，而且也會讓用戶感覺頁面不夠靈敏。進而盡量去使用事件委托技術，可以有效地減少事件處理程序的數量