本來打算介紹clipboard.js如何使用吩案，卻發(fā)現(xiàn)在https://clipboardjs.com介紹中事件委托竟然不知道，于是就有了這篇介紹患民。
1 事件委托的原理
事件委托是是利用事件的冒泡原理來實(shí)現(xiàn)的录粱，從內(nèi)層元素一層一層往外找，div>ul>li>a;比如給最里面的a加一個(gè)click點(diǎn)擊事件平委，那么這個(gè)事件就會(huì)一層一層的往外執(zhí)行雀扶，執(zhí)行順序a>li>ul>div，有這樣一個(gè)機(jī)制肆汹，那么我們給最外面的div加點(diǎn)擊事件愚墓，那么里面的ul，li昂勉，a做點(diǎn)擊事件的時(shí)候浪册，都會(huì)冒泡到最外層的div上，所以都會(huì)觸發(fā)岗照，這就是事件委托村象，委托它們父級(jí)代為執(zhí)行事件。
2針對(duì)dom中已經(jīng)有的元素舉例
1未使用事件委托
實(shí)現(xiàn)功能是點(diǎn)擊li攒至，打印11111：
<body>
<ul id="uli">
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
</ul>
</body>
在我認(rèn)識(shí)事件委托之前厚者，代碼都是這樣寫的，首先要找到ul迫吐，然后遍歷li库菲，然后點(diǎn)擊li的時(shí)候，又要找一次目標(biāo)的li的位置志膀，才能執(zhí)行最后的操作熙宇，每次點(diǎn)擊都要找一次li；
<pre>
<script>
window.onload = function () {
var oUl = document.getElementById('uli');
var aLi = oUl.getElementsByTagName('li')
for(i=0;i<aLi.length;i++){
aLi[i].onclick = function () {
console.log('11111');
}
}
}
</script>
</pre>
2使用事件委托
這里用父級(jí)ul做事件處理溉浙，當(dāng)li被點(diǎn)擊時(shí)烫止，由于冒泡原理，事件就會(huì)冒泡到ul上戳稽，因?yàn)閡l上有點(diǎn)擊事件馆蠕，所以事件就會(huì)觸發(fā)。大大減少了dom的操作
<pre>
<script>
window.onload = function () {
var oUl = document.getElementById('uli');
oUl.onclick = function () {
console.log('11111');
}
}
</script>
</pre>
參考http://www.cnblogs.com/liugang-vip/p/5616484.html
