使用 Chrome JavaScript 调试器/如何中断页面加载事件

我正在使用 chrome 的调试器，我很擅长在页面运行时设置断点。我的问题是，当我做 f5或按下输入的 URL 行我的断点消失。如何在第一次加载页面时在代码中设置断点？

61523 次浏览
小开

尝试在你的代码中加入 debugger;，这也适用于 FF 的 Firebug

小开
最佳答案

Safari 和 Firefox 的后续版本应该能够正确地处理重载之间的断点，但是需要确保请求之间的查询是完全相同的。例如，ExtJS4添加了一个 _dc=<epoch>，它将禁用缓存。

要停止这种行为，请添加以下内容:

Ext.Loader.setConfig({
disableCaching: false,
enabled: true
});

希望能帮上忙！

小开

在 Chrome 的开发工具中，转到 消息来源选项卡。在右边，打开 事件侦听器断点，您可以在事件上设置断点。

这听起来好像您想要在 DOM 内容加载上设置断点，DOM 内容加载在 DOM 突变部分下面。

完成此操作后，重新加载页面，最终将进入调试器。

小开

我使用适合于 Chrome、 Safari的下一种方法，使用 Charles Proxy< sup > [ About ] 和 Rewrite Tool

debugger;

或者需要让浏览器控制台等待

setTimeout(function(){
debugger;
console.log('gets printed only once after timeout');
}, 7000);

setTimeout是一个函数，它将在延迟后触发，以便给用户时间附加控制台

小开

也可以使用 XHR/提取断点设置调试器

在 铬显影剂 tools-> source 选项卡中，在右窗格中可以看到 XHR/提取断点，使用它可以设置断点。

  1. 添加断点
  2. 输入要断开的字符串。当这个字符串出现在 XHR 的请求 URL 中的任何位置时，DevTools 会暂停。

如果必须为所有 XHR 或提取设置断点，请检查选项 任何 XHR 或者接球

在 火狐开发者中，工具-> 调试器选项卡，添加到上面的特性中，我们可以根据请求方法设置调试器。

小开

如果你想在 javascript 第一次在浏览器中加载的时候停止它(而不是在 DOMContentLoadedevent 侦听器被触发之后) ，只需点击 chrome 调试器中的暂停按钮，然后用 F5键盘按钮重新加载你的页面。 这招对我很管用。


提交答案