什么叫事件委托
它还有一个名字叫事件代理，事件委托就是利用事件冒泡，只指定一个事件处理程序，就可以管理某一类型的所有事件。(简单点就是自己的事你委托给别人让别人干了，这时候碰巧另一个朋友也是去办理这个事，同样也可以让这个你委托办事的人帮另一个朋友也一起办了。）
这样做的优点好处
- 省监听数（减少内存使用）
- 可以监听动态元素
比如以下代码
<div id="x">
<button>一</button>
<button>giao</button>
<button>我</button>
<button>里</button>
<button>giao</button>
<button>giao~</button>
</div>
这里要是给每一个button都加一个点击事件
x.addEventListener('click',(e)=>{
const t = e.target
if(t.targetName.toLowerCase() === 'button'){
console.log('button 被点击了')
}
})
封装事件委托
on ('click','#div','button', ()=>{
console.log('button, 被点击了')
})
function(element, eventType, selector, fn) {
if (!(element instanceof Element)){
element = document.querySelector(element)
}
element.addEventListener(eventType, e => {
let el = e.target
while (!el.matches(selector)) {
if (element === el) {
el = null
break
}
el = el.parentNode
}
el && fn.call(el, e, el)
})
return element
},
