event.target指向真正触发事件的最内层元素，event.currentTarget指向当前执行事件处理函数的绑定元素；二者在事件委托中常不同，target用于精准识别被点子元素，currentTarget等价于this。
在 JavaScript 中，target 属性用于获取**真正触发事件的那个元素**，而不是绑定事件监听器的元素。它属于事件对象（event），在事件处理函数中通过 event.target 访问。
target 和 currentTarget 的区别
target 指的是用户实际点击、输入或交互的最内层元素；currentTarget 指的是当前正在执行事件处理函数的那个绑定事件的元素（即 addEventListener 所在的元素）。
- 当事件没有冒泡或监听器直接绑在目标元素上时，两者可能相同
- 但在事件委托场景下（比如父元素监听子元素的点击），它们通常不同
常见用法：事件委托中精准识别被点中的子元素
给父容器绑定点击事件，利用 event.target 判断具体哪个子元素被点击：
document.getElementById('list').addEventListener('click', function(e) {
if (e.target.tagName === 'LI') {
console.log('点击了列表项：', e.target.textContent);
}
});
这样即使 <li> 是动态添加的，也不需要为每个 <li> 单独绑定事件。
立即学习“Java免费学习笔记（深入）”；
注意 target 可能是文本节点或非预期元素
如果用户点击的是 <button>确认</button> 中的文字部分，e.target 可能是内部的 Text 节点（不是 button 元素）。为避免出错，常用以下方式安全获取目标元素：
- 用
e.target.closest('button')向上查找最近的 button 元素 - 或先检查
e.target.nodeType === Node.ELEMENT_NODE排除非元素节点 - 也可用
e.target instanceof Element判断是否为元素节点
实用技巧：过滤特定类型或类名的触发源
例如只响应带 data-action 属性的按钮：
container.addEventListener('click', function(e) {
const btn = e.target.closest('[data-action]');
if (btn) {
console.log('触发动作：', btn.dataset.action);
}
});
closest() 非常适合这类需求——它从 target 开始向上查找匹配的选择器，天然兼容事件冒泡和嵌套结构。
