我怎么知道 removeEventListener 成功了？

Question

有没有办法确认 removeEventListener 成功了？我在“播放”/“暂停”事件的视频元素上使用它。我试图实现的行为似乎不一致。这是我如何使用它的示例。

var playListener = function(){
  console.log("video is playing") 
}

videoElement.addEventListener("playing", playListener)

我代码中的其他地方

videoElement.removeEventListener("playing", playListener)

playListener 在我使用 removeEventListener 的地方可用，我正在传递视频元素的 id，因此它与我添加事件侦听器的 videoElement 相同。

我想知道我是否可以做一些 console.log 或其他事情来确认 removeEventListener 有效。

Answer 1

不幸的是，removeEventListener 方法在未成功删除事件侦听器时不会 return 任何内容或抛出错误。也没有 JavaScript 方法来访问当前为给定元素设置的事件侦听器。

就调试问题而言，大多数现代浏览器的开发人员工具都提供查看事件侦听器的功能。您可以在代码中放置 debugger 语句（或设置断点）以在调用 removeEventListener:

之前立即暂停执行

debugger;
videoElement.removeEventListener("playing", playListener);

到达断点并暂停执行后，从 Chrome Dev Tools 的“元素”选项卡中检查事件侦听器以验证您的事件侦听器当前已设置：

您还可以在 Firefox 开发工具的检查器选项卡中找到事件侦听器：

在确认您的事件侦听器当前已设置后，返回调试器 (Chrome "Sources" Tab / Firefox "Debugger" Tab ) 并逐行执行代码 (F10)。

调用 removeEventListener 后，返回并再次检查您的事件侦听器。如果成功，则不应再设置事件侦听器。完成调试后，您可以恢复代码执行 (F8)。

How do I know that removeEventListener was successful?