關於事件委託的整理 ，另附bind,live,delegate,on區別

隨着DOM結構的複雜化和Ajax等動態腳本技術的運用致使現在的js界裏最火熱的一項技術應該是‘事件委託(event delegation)’了,什麼是事件委託呢？小七給你娓娓道來,說白了就是想給子元素添加事件反而添加到父元素的身上，如今的你可能會說博主有病，放屁脫褲子畫蛇添足，那麼博主告訴你博主放屁是不脫褲子的，下面說下何時使用事件委，（1）考慮一個ul，在li的數量很是少的時候，爲每個li添加事件固然不會存在太多性能方面的問題，可是當列表很是的長for循環太浪費內存，長到上百上千甚至上萬的時候，爲每一個li添加事件就會對頁面性能產生很大的影響。（習慣用ul了，其餘元素嵌套關係自行腦補）（2）給一個ul裏面的幾個li添加了事件可是若是動態又生成了li則剛生成的li不具有事件這時就須要用到委託。
使用委託的優勢：本來須要給多個元素添加事件的如今只須要給他們的父元素添加事件，提升性能，提升可讀性。
那麼如今是否是有點了解了呢？廢話很少說直接上圖，高清無碼的哦、
點擊每個li都會觸發事件alert出1。
HTML：

Jq代碼不用委託：

Jq代碼事件委託：

li就是子元素，jq委託的格式就是這樣記住就行，固然on能夠用bind,live,delegate.然而爲何小七沒用呢天然是有緣由的。
jQuery 1.3以前使用.bind()實現委託給他已經存在的子元素綁定事件，但不能給將來新增的元素綁定事件
爲了突破單一.bind()方法的侷限性jQuery 1.3使用live（）方法但卻只能放在直接選擇的元素後面，不能在層級比較深，連綴的DOM遍歷方法後面使用，即$(「ul」").live...能夠，但$("body").find("ul").live...不行；
後來，爲解決「事件傳播鏈」過長的問題， jQuery 1.4.2乾脆直接引入了一個新方法.delegate()。
根據jQuery 1.7 Beta 1的發版說明，jQuery 1.7爲了解決.bind()、.live()和.delegate()並存形成的不一致性問題，將會增長一對新的事件方法：.on()，因此不用糾結用刀仍是用槍了之後直接用迫擊炮（on（）方法）
提示：使用事件委託時，若是註冊到目標元素上的其餘事件處理程序使用.stopPropagation()阻止了事件傳播，那麼事件委託就會失效。