怎么触发子级的点击事件_JS的事件委托

引言：遇到下面应用场景，你要怎么办？

场景一：

我们要给100个按钮添加点击事件，怎么办？
最笨的办法：直接给100个按钮都addEventListener
但是有了事件委托后：监听这100个按钮的祖先，等冒泡的时候，判断target是不是这100个按钮中的一个 就可以了

场景二：

我们要监听目前不存在的元素的点击事件，咋办？
有了事件委托：监听祖先，等到冒泡时，判断点击的元素是不是我想要监听的元素就可以了。

事件委托这么牛，那他到底是什么，怎么实现的呢？别急，往下看。。。

一、什么是事件委托？有什么好处？

事件委托是指利用冒泡原理，把事件加到父级上，触发执行效果。

由于冒泡阶段，浏览器从用户点击的内容从下往上遍历至 window，逐个触发事件处理函数，

因此可以监听一个祖先节点(例如爸爸节点、爷爷节点)来同时处理多个子节点的事件。

好处：

• 减少事件数量，提高性能。
• 预测未来元素，新添加的元素仍然可以触发该事件。

---听起来不错，拉出来看看？

---好的，展示！

代码一：“实现10(或者更多)个按钮，绑定cli