DOM事件回调中this默认指向绑定监听器的元素；内联onclick中this指向window；箭头函数无this需用event.currentTarget；显式bind会覆盖默认绑定；推荐直接使用event参数获取元素。
在 DOM 事件回调中，this 默认指向触发该事件的 DOM 元素，这是 JavaScript 中 this 绑定的一个明确且常见的特殊场景。
事件处理函数中的 this 自动绑定到目标元素
当你用传统方式（如 addEventListener 或内联 onclick）注册事件监听器时，浏览器会自动把回调函数内的 this 设为当前事件的目标元素（即 event.target 或更准确地说，是绑定监听器的那个元素，通常是 event.currentTarget）。
- 使用
addEventListener：回调中this指向添加监听器的那个元素（currentTarget） - 内联写法如
<button onclick="handleClick()">：此时this不指向按钮，而是全局对象（非严格模式下是window），因为内联 handler 是作为字符串执行的普通函数调用 - 如果用
elem.onclick = handleClick，则this指向elem
箭头函数不会改变 this 的绑定规则——它根本就没有自己的 this
如果你用箭头函数作为事件回调，它不绑定 this，而是沿作用域链向上查找外层函数的 this。这意味着它不会自动获得 DOM 元素的引用。
-
button.addEventListener('click', () => console.log(this))→ 输出外层作用域的this（比如组件实例、undefined或window） - 想访问 DOM 元素？得通过参数
event的currentTarget或target属性
手动绑定 this 可能覆盖默认行为
显式使用 .bind()、.call() 或 .apply() 会强制指定 this 值，从而覆盖浏览器原本的 DOM 元素绑定。
-
button.addEventListener('click', handleClick.bind(obj))→ 回调中this永远是obj，不是 button - 类方法作为回调时，若未绑定，
this会丢失（变成undefined或window），这时需用bind、箭头函数或 class 字段语法修复
现代写法推荐：优先用 event 参数，而非依赖 this
为避免混淆和兼容性问题，建议在事件回调中直接使用 event.currentTarget 获取绑定监听器的元素，或用 event.target 获取实际触发事件的元素。
-
button.addEventListener('click', (e) => console.log(e.currentTarget))更清晰、可控 - 尤其在框架（如 React）中，事件对象被合成，
this通常不可靠，必须依赖e
