removeEventListener 移不掉的根本原因是传入的函数引用与 addEventListener 时不一致，且 options 参数必须完全相同；闭包、箭头函数、bind() 新实例及 options 不匹配均导致失败。
removeEventListener 为什么经常移不掉
根本原因就一个：传给 removeEventListener 的函数引用，必须和当初传给 addEventListener 的**完全相同**。闭包、箭头函数、内联函数、bind() 后的新函数，都会导致引用不一致，移除失败。
常见错误现象：removeEventListener('click', handleClick) 执行后点击依然触发；控制台没报错，但逻辑没断开。
- 用箭头函数注册事件 → 移除时不能用另一个箭头函数（哪怕内容一模一样）
- 用
handleClick.bind(this, arg)注册 → 移除时必须用同一个bind返回的函数实例 - 在循环里用
for (let i...)绑定事件，却在外部用function() {...}尝试移除 → 引用丢失
正确移除的三种可靠写法
核心原则：确保「添加」和「移除」用的是同一个函数值。推荐以下方式：
-
命名函数 + 直接引用：定义独立函数，添加和移除都用函数名，最稳妥
function handleClick() { console.log('clicked'); }<br>btn.addEventListener('click', handleClick);<br>// ...<br>btn.removeEventListener('click', handleClick); -
保存绑定后的函数引用：若需预置参数，先
bind并存变量，后续复用该变量const handler = handleClick.bind(null, 'id-123');<br>btn.addEventListener('click', handler);<br>// ...<br>btn.removeEventListener('click', handler); -
使用 AbortSignal（现代推荐）：Chrome 88+、Firefox 79+ 支持，无需保存函数引用
const controller = new AbortController();<br>btn.addEventListener('click', () => console.log('ok'), { signal: controller.signal });<br>// ...<br>controller.abort(); // 自动解绑所有关联事件
addEventListener 的 options 参数必须严格一致
如果添加时用了 { once: true }、{ capture: true } 或 { passive: true }，移除时也得传完全相同的 options 对象——否则匹配失败，事件不会被移除。
Convert Markdown To HTML And PDF - Markdown和HTML、PDF互转
下载
实现 Markdown↔ HTML 互转，支持导出 PDF，用于用户请求的文档格式转换。
立即学习“前端免费学习笔记（深入）”；
错误示例：addEventListener('scroll', onScroll, { passive: true })，却用 removeEventListener('scroll', onScroll)（漏了 { passive: true }）→ 移除无效。
- 建议显式写出
options并复用变量，避免手误const opts = { passive: true, capture: false }; -
once: true的事件触发后自动移除，无需手动调用removeEventListener -
capture阶段和冒泡阶段的监听器是分开存储的，必须用对应capture值才能匹配到
调试移除是否成功的小技巧
浏览器不提供直接查看已绑定事件的 API，但可以靠行为验证：
- 移除后再次触发事件，检查控制台是否还有日志或副作用发生
- 用 Chrome DevTools 的 Elements 面板 → 右键元素 → “Break on” → “attribute modifications”，再手动修改
onclick等属性，观察是否还响应 - 临时加个计数器：
let count = 0; btn.addEventListener('click', () => console.log(++count))，移除后再点，数字是否停涨 - 注意：
getEventListeners(element)是 DevTools 内部命令，仅控制台可用，不能用于生产代码
最常被忽略的是 options 不一致和函数引用不匹配——这两个点卡住，其他操作都白搭。
