安全移除事件监听器需同时满足：1. 使用同一函数引用；2. 事件类型相同；3. 选项对象（如capture、once、passive）完全一致；匿名函数不可复用，推荐命名函数配合显式配置对象。
要安全移除已绑定的事件监听器，关键在于：必须使用与 addEventListener 完全相同的函数引用、事件类型和选项（如 once、capture、passive），三者缺一不可。
必须传入同一个函数引用
匿名函数或箭头函数每次都会生成新引用，无法被 removeEventListener 识别：
Java注释规范Skills
下载
当用户要求为 Java 代码添加注释、修改注释、审查注释、整理注释格式，或要求按照代码注释规范处理 Java 文件时，使用本技能。本技能用于统一生成和维护 Java 类注释模板、按 Git 对比 release 判断版本号、补充每行代码上方中文块注释、调整注释空行规则，并保持 Java 文件 UTF-8 无 BOM 编码。典型触发场景包括：补充类注释、更新 @version、检查 @author 来源、整理行尾注释、把注释放到代码上一行、检查注释是否符合规范、构建前检查 Java 注释风格。
// ❌ 错误：无法移除（两次创建的是不同函数）
btn.addEventListener('click', () => { console.log('hi') });
btn.removeEventListener('click', () => { console.log('hi') }); // 不生效
<p>// ✅ 正确：复用同一函数引用
function handleClick() { console.log('hi'); }
btn.addEventListener('click', handleClick);
btn.removeEventListener('click', handleClick); // 成功移除
</p>注意 capture 选项必须一致
如果添加监听器时启用了捕获阶段（{ capture: true }），移除时也必须显式传入相同配置：
-
addEventListener('click', fn, true)→ 必须用removeEventListener('click', fn, true) -
addEventListener('click', fn, { capture: true })→ 对应removeEventListener('click', fn, { capture: true }) - 默认不写
capture或写false，移除时也不能传true或{ capture: true }
避免常见陷阱
-
不要依赖
once: true后自动清理：它只保证执行一次，但监听器仍会驻留直到触发完毕；若需提前取消，仍要手动移除（且需传{ once: true }） - 动态绑定场景建议用对象封装：把 handler 和 options 存在变量里，确保增删参数完全一致
-
移除前可加存在性检查（非必需但更稳妥）：虽然
removeEventListener对不存在的监听器静默失败，但结合 WeakMap 或自定义管理器可追踪绑定状态
推荐做法：用命名函数 + 显式 options 对象
结构清晰、易维护、不易出错：
const config = { capture: false, passive: false };
const handler = function(e) { /* 处理逻辑 */ };
<p>element.addEventListener('scroll', handler, config);
// ……后续某处
element.removeEventListener('scroll', handler, config);
</p>Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南
