原理
事件委托得益于事件冒泡（有关事件冒泡可以参考事件冒泡与事件捕获），当监听子元素时，事件冒泡会通过目标元素向上传递到父级，直到document，如果子元素不确定或者动态生成，可以通过监听父元素来取代监听子元素。
封装事件委托
<div id="div">
</div>
<script>
setTimeout(()=>{
const button = document.creatElement('button')
button.textContent = 'click 1'
div1.appendChild(button)
},1000)
on('click','#div','button',()=>{
console.log('button被点击了')
})
function on(eventType, element, selector, fn){
//判断如果element不是元素
if(!(element instanceof Element)){
element = document.querySelector(element)
}
element.addEventListener(eventType,(e)=>{
const t = e.target
//matches判断一个元素是否满足一个选择器
if(t.matches(selector)){
fn(e)
}
})
}
</script>
