JS `Event Delegation` (事件委托)：利用事件冒泡提升性能与代码简洁性

各位观众，各位朋友，前端的英雄们，大家好！欢迎来到今天的“JS 事件委托：偷懒的艺术”讲座。我是你们的老朋友，一只秃头但热爱写代码的程序猿。今天，咱们不聊那些高大上的框架，就来聊聊一个看似简单，实则威力无穷的技巧——事件委托。

一、啥是事件委托？（别告诉我你不知道！）

想象一下，你家办喜事，来了几百号亲戚朋友。如果你要一个个敬酒、一个个发红包，那不得累死？但如果你找个司仪，让大家集中注意力，统一敬酒、统一发红包，是不是就轻松多了？

事件委托，就是前端界的司仪！

简单来说，事件委托就是：把原本绑定在子元素上的事件，委托给它们的父元素（或更高层级的祖先元素）来处理。

听起来有点玄乎？没关系，咱们来个生动的例子：

<ul id="myList">
  <li>Item 1</li>
  <li>Item 2</li>
  <li>Item 3</li>
</ul>

假设我们需要给每个 <li> 元素都绑定一个点击事件，弹出一个提示框，显示被点击的 <li> 的内容。

传统做法（笨办法）：

const listItems = document.querySelectorAll('#myList li');

listItems.forEach(it