javascript - 如何在 Chrome 的元素选项卡中设置事件监听器断点？

Question

我正在努力在动态生成的 DOM 元素中设置断点，其中不同的事件处理程序也从 Javascript 绑定(bind)。这基本上意味着我有一个漂亮的 DOM 结构，它不是最初接收到的 HTTP 响应的一部分，它纯粹是在客户端构建的。

现在的问题是 Chrome 的 Elements 选项卡只允许我设置断点

• 子树修改或
• 属性修改或
• 节点移除

是否可以通过某种方式在动态创建的 DOM 元素的动态创建的事件监听器中设置断点？ (见附图。我想将断点设置到 listenerbody 中)

请注意，我也不能使用“来源/脚本”选项卡，因为它只显示最初收到的静态 HTTP 内容响应。而且我无法在“事件监听器” Accordion 中引用的代码中设置断点，因为它只会在事件监听器被附加时向我显示事件监听器，而不是在它被触发时!

有什么想法吗？

Answer 1

Sources -> Event Listener Breakpoints 包含一堆复选框，可以选中这些复选框以在触发事件的事件监听器时激活断点。