addEventListener是JavaScript中为元素绑定事件监听器的标准方法，支持多监听器共存、灵活配置options（如once、capture）、接收Event对象获取触发细节，并推荐使用具名函数以便移除。
在 JavaScript 中，addEventListener 是为元素绑定事件监听器的标准方法，它比直接写 onclick 等内联属性更灵活、更安全，支持多个监听器共存，也便于后续移除。
基本用法：绑定单个事件
语法是：element.addEventListener(eventType, callback, options)。其中：
-
eventType 是字符串，如
"click"、"input"、"keydown"，不带on前缀 - callback 是触发时执行的函数，可以是具名函数、匿名函数或箭头函数
-
options 是可选对象，常用
{ once: true }（只触发一次）或{ capture: true }（捕获阶段触发）
示例：
const btn = document.getElementById("myBtn");
btn.addEventListener("click", function() {
console.log("按钮被点击了");
});
推荐写法：使用具名函数方便移除
如果后续可能需要取消监听（比如页面切换、组件卸载），建议用具名函数，避免匿名函数无法精准移除：
立即学习“Java免费学习笔记（深入）”；
Alibabacloud Sdk Client Initialization For Java
下载
在 Java 中初始化和管理阿里云 SDK客户端。包括单例模式、线程安全、endpoint 与 region 配置、VPC 终端节点、同步与异步等。
function handleClick() {
console.log("处理点击逻辑");
}
const btn = document.querySelector("button");
btn.addEventListener("click", handleClick);
// 后续可随时移除
btn.removeEventListener("click", handleClick);
监听事件对象：获取触发细节
回调函数默认接收一个 Event 对象参数，从中可读取目标元素、按键码、鼠标位置等信息：
inputElement.addEventListener("input", function(e) {
console.log("输入内容：", e.target.value);
console.log("触发元素：", e.target);
console.log("事件类型：", e.type); // "input"
});
注意：e.target 是实际触发事件的元素（可能是子元素），而 e.currentTarget 才是绑定监听器的那个元素。
绑定多个相同事件或不同事件
同一个元素可以对同一事件绑定多个监听器，它们会按注册顺序依次执行：
btn.addEventListener("click", () => console.log(1));
btn.addEventListener("click", () => console.log(2)); // 都会执行
也可以为一个元素绑定多种事件：
btn.addEventListener("mouseenter", showTooltip);
btn.addEventListener("mouseleave", hideTooltip);
btn.addEventListener("click", handleSubmit);
