Question

我正在尝试创建一个旋转横幅（JavaScript和CSS）。为了在开发人员控制台中对CSS等进行调试和更改，我想在进行更改时暂停JavaScript执行，然后运行它等等。那么，有没有办法在浏览器中暂停脚本执行？

Answer 1

您正在寻找“断点”。

您使用的是哪种浏览器？

Chrome在其开发者工具中立即支持断点：
~~F12（或Ctrl-Shift-I），“脚本”选项卡，从下拉列表中选择脚本，单击行号。~~
更新：
在PC上： F12 或 Ctrl + Shift + I /在Mac上： Cmd + 替代 + 我
选择“Sources”选项卡，从左侧的文件窗格中选择脚本，单击行号。

在Firefox中使用Firebug扩展名：
在PC和Mac上： F12 ，
“脚本”标签，激活＆amp;如果需要重新加载，从下拉列表中选择脚本，单击行号。

当您的Javascript在断点处暂停时，两个浏览器都会为您提供常用的调试工具，以便单步执行代码，检查＆amp;更改变量值，观察表达式，......

Answer 2

在katspaugh中提及their comment：

F8

这仅适用于Chrome 59.0.3071.115（在Mac OS X上）开发人员工具窗口的来源标签中。

Answer 3

您可以自己编写一个暂停代码。使用调试器暂停javascript执行。在Chrome控制台中，运行：

window.addEventListener('keydown', function(event) { 
  if (event.defaultPrevented) {
    return; // Should do nothing if the default action has been cancelled
  }
  let handled = false;
  if (event.keyCode == 123) {
    handled = true;
    debugger;  // 123 is the keyCode of F12
  }
  if (handled) {
    // Suppress "double action" if event handled
    event.preventDefault();
  }
});

带有检查器的突出显示元素

点击 F12

如何在Developers控制台中暂停脚本执行

3 个答案: