button点击触发事件_DOM 事件委托

比如有下面的代码

<div id = 'a'>
  button * 100
</div>

这里需要监听100个button，我不可能给每一个button添加一个事件

所以只要给所有 button 的祖先元素 div 添加一个事件，事件函数执行的时候判断一下被点击的元素是不是button就行了，代码如下：

let div = document.getElementById('a')                  //获取这个div
div.addEventListener('click' , (e) => {
   if(e.target.tagName.toLowerCase() === 'button'){     //判断被点击的是不是button
      这里写需要执行的代码
   }
} )

将事件的处理程序绑定给一个父级元素，当任何子节点触发了匹配的父级元素绑定的事件，即可触发父级节点的处理程序，这就是事件委托。