如何在Google Chrome浏览器中启动JavaScript调试器？

使用Google Chrome浏览器时，我想调试一些JavaScript代码。我怎样才能做到这一点？

Windows系统：CTRL- SHIFT- J或F12

苹果：⌥- ⌘-J

也可以通过扳手菜单（工具> JavaScript控制台）使用：

尝试将其添加到您的源中：

debugger;

它适用于大多数（如果不是全部）浏览器。只需将其放置在代码中的某个位置，它将像断点一样工作。

Windows和Linux：

Ctrl+ Shift+ I键打开开发人员工具

Ctrl+ Shift+ J打开开发人员工具并将焦点移到控制台。

Ctrl+ Shift+ C切换检查元素模式。

苹果电脑：

⌥+ ⌘+ I键打开开发人员工具

⌥+ ⌘+ J打开开发人员工具并将焦点移到控制台。

⌥+ ⌘+ C切换检查元素模式。

资源

其他捷径

F12在Chrome浏览器中按功能键以启动JavaScript调试器，然后单击“脚本”。

选择顶部的JavaScript文件，并将断点放置到调试器以获取JavaScript代码。

Ctrl+ Shift+ J打开开发人员工具。

在Mac上的Chrome 8.0.552中，您可以在菜单View / Developer / JavaScript Console ... 下找到它，也可以使用Alt+ CMD+ J。

在这里，您可以找到访问开发人员工具的快捷方式。

https://developer.chrome.com/devtools/docs/shortcuts

Shift+ Control+ I打开开发人员工具窗口。从左下角的第二个图像（如下所示）将为您打开/隐藏控制台：

要打开专用的“控制台”面板，请执行以下任一操作：

• 使用键盘快捷键
  • 在Windows和Linux上：Ctrl+ Shift+J
  • 在Mac上：Cmd+ Option+J
• 选择Chrome菜单图标，菜单-> 更多工具 -> JavaScript控制台。或者，如果Chrome开发者工具已经打开，请press使用“控制台”标签。

请参考这里

对于Mac用户，请转到Google Chrome浏览器->菜单视图 -> 开发人员 -> JavaScript控制台。

现在，谷歌浏览器引入了新功能。通过使用此功能，您可以在chrome浏览器中编辑代码。（永久更改代码位置）

为此，请按F12->“源”选项卡-（右侧）->“文件系统”，请选择您的代码位置。然后chrome浏览器会征求您的许可，此后代码将以绿色显示。并且您可以修改您的代码，它也会反映在您的代码位置（这意味着它将永久更改）

谢谢

我发现进入javascript调试器的最有效方法是运行以下命令：

chrome://inspect

F12 打开开发人员面板

CTRL + SHIFT + C 将打开“悬停检查”工具，当您悬停时它将突出显示元素，您可以单击以在“元素”选项卡中显示它。

CTRL + SHIFT + I 使用控制台选项卡打开开发人员面板

右键单击>检查 右键单击任何元素，然后单击“检查”以在“开发人员”面板的“元素”选项卡中将其选中。

ESC 如果右键单击并检查元素或类似元素，然后在“元素”选项卡中查看DOM，则可以按ESC上下切换控制台，这是同时使用两者的好方法。

这些是您看到的工具

按下 F12

在Chrome的控制台中，您可以执行console.log(data_to_be_displayed)。