如何从Chrome中的代码设置JavaScript断点？

我想强制Chrome调试器在通过代码行上中断，或者使用某种注释标记，例如console.break()。

302827 次浏览
小开
最佳答案

您可以在代码中使用debugger;。如果开发人员控制台打开，执行将中断。它也适用于Firebug。

小开

在“脚本”选项卡上，转到您的代码所在的位置。在行号的左侧，单击。这将设置一个断点。

截图：

Chrome中断点的屏幕截图

然后，您将能够在右侧选项卡中跟踪断点（如屏幕截图所示）。

小开

这是可能的，您可能想要这样做的原因有很多。例如，在页面加载开始时调试一个javascript无限循环，这会阻止chrome开发人员工具集（或Firebug）正确加载。

见第2节

或者只需在所需的测试点将包含单词调试器的行添加到您的代码中。

小开

正如其他人已经说过的，debugger;是要走的路。 我写了一个小脚本，您可以在浏览器的命令行中使用它来在函数调用之前设置和删除断点： http://andrijac.github.io/blog/2014/01/31/javascript-breakpoint/

小开

设置一个按钮单击监听器并调用debugger;

示例

$("#myBtn").click(function() {
debugger;
});

Demo

http://jsfiddle.net/hBCH5/

JavaScript中的调试资源

小开

debugger是EcmaScript的保留关键字，自ES5以来给出可选的语义学

因此，它不仅可以用于Chrome，还可以用于Firefox和Node.jsvianode debug myscript.js。

标准说：

语法

DebuggerStatement :
debugger ;

语义学

评估调试语句的生成可能允许实现在调试器下运行时导致断点。如果调试器不存在或不活动，则此语句没有可观察到的效果。

生产Debugger声明：调试器；的计算如下：

  1. 如果实现定义的调试工具可用且已启用，则
    1. 执行实现定义的调试操作。
    2. 让结果是一个实现定义的完成值。
  2. 其他
    1. 设结果为（正常、空、空）。
  3. 返回结果

ES6没有变化。

小开

您还可以使用debug(function)，在调用function时中断。

命令行API参考：调试

小开

断点：-

断点将停止执行，并让您检查JavaScript值。

检查值后，您可以继续执行代码（通常使用播放按钮）。

调试器：-

调试器；停止JavaScript的执行，并调用调试函数。

调试器语句暂停执行，但不会关闭任何文件或清除任何变量。

Example:-
function checkBuggyStuff() {
debugger; // do buggy stuff to examine.
};
小开

您也可以将debug(functionName)设置为调试函数。

https://developers.google.com/web/tools/chrome-devtools/javascript/breakpoints#function

小开

调试JavaScript代码的方法有很多。以下两种方法广泛用于通过代码调试JavaScript

  1. 使用console.log()打印浏览器中的值 控制台。（这将帮助您了解某些点的值 您的代码）

  2. 调试器关键字。将debugger;添加到您想要的位置 调试，并打开浏览器的开发人员控制台并导航到 源选项卡。

有关调试JavaScript代码的更多工具和方法，请参阅此链接由W3School提供。

小开

如果你只是想杀死和停止javascript代码，我不推荐debugger;，因为debugger;只会暂时冻结你的javascript代码，而不是永久停止它。

如果您想在命令中正确杀死和停止javascript代码，请使用以下命令：

throw new Error("This error message appears because I placed it");

小开

这个要点Git预提交钩子从您的merb项目中删除杂散的调试器语句

如果想在提交时删除debugger断点，可能有用


提交答案