事件委托

​

目录

 前言

导语

代码部分

总结

---

 前言

我是歌谣 歌谣的意志是永恒的 放弃很容易 但是坚持一定很酷

导语

事件委托

​编辑

代码部分

事件委托的核心原理：给父节点添加侦听器， 利用事件冒泡影响每一个子节点

绑定一百个li

var itemli = document.getElementsByTagName('li') for (var i = 0; i < itemli.length; i++) { itemli[i].onclick = (function (n) { return function () { console.log(n + itemli[n].innerHTML) } })(i) }

var ul = document.querySelector('ul') ul.onclick = function (e) { e = e || window.event //这一行及下一行是为兼容IE8及以下版本 var target = e.target || e.srcElement if (target.tagName.toLowerCase() === 'li') { var li = this.querySelectorAll('li') index = Array.prototype.indexOf.call(li, target) alert(target.innerHTML + index) } }

总结

事件委托的核心原理：给父节点添加侦听器， 利用事件冒泡影响每一个子节点

​