javascript巡回&イベントエージェント(依頼)

需要:各liにクリックイベントを追加する必要があれば.
一、従来の実現方法:各liを遍歴し、それぞれのliに単独でイベントをクリックする.

   
001
   
002
   
003



var oUl = document.getElementById('ul1');
var aLi = oUl.getElementsByTagName('li');
for (var i = 0, i = aLi.length; i++) {
　　aLi.onclick = fn;
}

短所:1、もし現在のページに複数のliがあれば、例えばポータルニュースサイトのニュースリスト.遍歴が必要なら、性能に影響があります.
2、新たにliを追加したら、例えばミニブログを出す時、先ほど送ったミニブログは、ちょうど送ったミニブログが事件を持ってくることができますか?第2点に対して:答えは新しく作成された要素は前遍歴のイベントを持たないので、要素を作る前にすでにliを遍歴しました.すでに存在したliにイベントを加えました.
二、解決案:
上記の二つの欠点を解決するために、私達は事件代理を使って、事件依頼の方式で実現します.事件の依頼をよりよく理解するために、まず事件に関する知識を知るべきです.ここでは、事件が起こったとは詳しくは言いません.イベントの泡立ちや捕獲の特性により、ulにイベントをクリックすることができます.

var oUl = document.getElementById('ul1');
oUl.onclick = function(ev) {
    var ev = ev || event;
    //    
    var target = ev.target || ev.srcElement;
　　//  li  
    if (target.nodeName.toLowerCase() == 'li') {
          //li     
          fn();
     }
}

まとめ:evオブジェクトには一定の互換性がありますが、ここでの互換性の処理は難しくありません.実際には、イベント依頼の本質は、複数の要素の親レベルにイベントを追加し、泡を利用したり、次のサブ要素を捕獲し、単独でイベントをバインドします.