在JS中，DOM事件回调函数的this默认指向绑定事件的DOM元素（即currentTarget）；内联处理器中this同样指向该元素；箭头函数无this绑定，需用event.currentTarget替代；手动绑定会覆盖默认指向。
在 JS 中，DOM 事件回调函数里的 this 默认指向触发该事件的元素（即事件目标元素），但前提是使用传统方式绑定（如 onclick 属性或 addEventListener 且未手动改变上下文）。
原生事件监听器中 this 指向触发元素
使用 addEventListener 绑定时，回调函数中的 this 自动绑定为当前绑定事件的 DOM 元素（注意：不是 event.target，而是绑定时的元素，即 currentTarget）：
- 如果给
button添加点击监听，点击时this就是那个button元素； - 即使事件冒泡到父级，只要监听器挂在父元素上，
this仍是该父元素（而非实际被点击的子元素）； - 想获取真正被点击的元素，用
event.target；想获取监听器绑定的元素，用this或event.currentTarget（二者等价）。
内联 HTML 事件处理器中 this 也指向触发元素
写在 HTML 里的 onclick="handler()"，执行时函数内部的 this 同样指向该元素：
<button onclick="console.log(this)">点我</button> // 点击后输出：<button>点我</button>
但注意：如果内联调用的是箭头函数或显式绑定了 this 的函数，结果可能不同——因为内联写法只是执行表达式，不自动提供 this 绑定。
使用箭头函数会丢失 this 绑定
箭头函数没有自己的 this，它继承外层作用域的 this。所以以下写法中 this 不再指向 DOM 元素：
btn.addEventListener('click', () => {
console.log(this); // 通常是 window 或 undefined（严格模式）
});
✅ 正确做法是改用普通函数，或用 event.currentTarget 显式取元素：
- 用普通函数：
btn.addEventListener('click', function() { console.log(this); })； - 或在箭头函数里用
event.currentTarget替代this。
手动绑定 this 会覆盖默认行为
如果用 bind、call、apply 或类方法绑定（如 obj.handleClick.bind(obj)），this 就变成你指定的对象，不再指向 DOM 元素：
const obj = { name: 'test' };
btn.addEventListener('click', obj.handleClick.bind(obj)); // this 指向 obj
此时若仍需访问触发元素，只能通过 event.currentTarget。
不复杂但容易忽略：只要没用箭头函数、也没手动 bind/call/apply，this 在事件回调里就稳稳指向绑定事件的那个 DOM 元素。
