事件委托是将事件监听器绑定到父元素，利用冒泡机制统一处理子元素事件；它减少内存占用、提升动态内容性能，并简化DOM变更管理，但需用closest()精准匹配目标且避开不适用场景。
事件委托是什么：用一个监听器管住一群元素
事件委托不是给每个子元素单独绑事件，而是把事件监听器放在它们的共同父元素上，靠事件冒泡机制来统一处理。比如页面里有 100 个 每次调用 推荐做法是用 立即学习“Java免费学习笔记（深入）”； 注意点： 不是所有场景都适用。典型反例： 真正省事的前提是：结构稳定、语义清晰、冒泡路径可控。否则，硬套委托反而让逻辑更难 debug。，你不用调用 100 次 addEventListener，只在它们的 click，再通过 event.target 判断点的是哪个按钮。
为什么能提升性能：减少内存占用和绑定开销
addEventListener 都会创建一个事件监听器对象，占用内存；大量绑定还会拖慢初始渲染。事件委托把监听器数量压到 1 个，尤其适合动态增删子元素的场景（比如列表分页、聊天消息流）：
removeEventListener 或忘记清理怎么写才可靠：别只靠
event.target 直接判断event.target 是实际被点击的最深节点，但它可能是子元素里的 、 或文本节点，直接用 event.target.tagName === 'BUTTON' 容易失效。event.target.closest() 向上查找最近的匹配祖先：parent.addEventListener('click', (e) => {
const btn = e.target.closest('button');
if (btn) {
console.log('点中了按钮:', btn.dataset.id);
}
});
closest() 在 IE 中不支持，需加 polyfill 或改用遍历 parentNode
pointer-events: none 没乱用哪些情况不适合用事件委托
{ once: true }，另一个要 { passive: true }）e.stopPropagation()，会截断冒泡路径event.composedPath() 要配合处理，不能只信 target
