如何在 Google Chrome 中启动 JavaScript 调试器？
使用 Google Chrome 时，我想调试一些 JavaScript 代码。 我怎样才能做到这一点？
When using Google Chrome, I want to debug some JavaScript code. How can I do that?
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（15）
在 Chrome 的控制台中，您可以执行
console.log(data_to_be_displayed)。From the console in Chrome, you can do
console.log(data_to_be_displayed).这些是您看到的工具
按
F12These are the tools you see
Press the
F12F12
打开开发者面板
CTRL + SHIFT + C
将打开悬停检查工具，当您悬停时它会突出显示元素，您可以单击以在元素选项卡中显示它。
CTRL + SHIFT + I
打开带有控制台选项卡的开发人员面板
右键单击 > 检查
右键单击任何元素，然后单击“检查”以在“开发人员”面板的“元素”选项卡中选择它。
ESC
如果右键单击并检查元素或类似元素，最后在“元素”选项卡中查看 DOM，则可以按 ESC 上下切换控制台，这可能是一个很好的方法两者都用。
F12
opens the developer panel
CTRL + SHIFT + C
Will open the hover-to-inspect tool where it highlights elements as you hover and you can click to show it in the elements tab.
CTRL + SHIFT + I
Opens the developer panel with console tab
RIGHT-CLICK > Inspect
Right click any element, and click "inspect" to select it in the Elements tab of the Developer panel.
ESC
If you right-click and inspect element or similar and end up in the "Elements" tab looking at the DOM, you can press ESC to toggle the console up and down, which can be a nice way to use both.
我发现访问 javascript 调试器的最有效方法是运行以下命令：
chrome://inspectThe most efficient way I have found to get to the javascript debugger is by running this:
chrome://inspectShift + Control + I 打开开发工具窗口。 从左下角第二张图片（如下所示）将为您打开/隐藏控制台：
Shift + Control + I opens the Developer tool window. From bottom-left second image (that looks like the following) will open/hide the console for you:
要打开专用的“控制台”面板，可以：
请参阅此处
To open the dedicated ‘Console’ panel, either:
pressthe ‘Console’ tab.Please refer here
在这里，您可以找到访问开发人员工具的快捷方式。
https://developer.chrome.com/devtools/docs/shortcuts
Here, you can find the shortcuts to access the developer tools.
https://developer.chrome.com/devtools/docs/shortcuts
在 Mac 上的 Chrome 8.0.552 中，您可以在菜单查看/开发人员/JavaScript 控制台下找到它...或者您可以使用< kbd>Alt+CMD+J。
In Chrome 8.0.552 on a Mac, you can find this under menu View/Developer/JavaScript Console ... or you can use Alt+CMD+J.
Ctrl + Shift + J 打开开发人员工具。
Ctrl + Shift + J opens Developer Tools.
在 Chrome 浏览器中按 F12 功能键启动 JavaScript 调试器，然后单击“脚本”。
选择顶部的 JavaScript 文件并将断点放置到 JavaScript 代码的调试器上。
Press the F12 function key in the Chrome browser to launch the JavaScript debugger and then click "Scripts".
Choose the JavaScript file on top and place the breakpoint to the debugger for the JavaScript code.
现在谷歌浏览器推出了新功能。 通过使用此功能，您可以在 Chrome 浏览器中编辑代码。 （代码位置永久更改）
为此按 F12 --> 源选项卡 --（右侧）--> 文件系统 - 请在其中选择您的代码位置。 然后是chrome浏览器
会询问您的许可，之后代码将以绿色显示。 您可以修改您的代码，它也会反映您的代码位置（这意味着它将永久更改）
谢谢
Now google chrome has introduce new feature. By Using this feature You can edit you code in chrome browse. (Permanent change on code location)
For that Press F12 --> Source Tab -- (right side) --> File System - in that please select your location of code. and then chrome browser
will ask you permission and after that code will be sink with green color. and you can modify your code and it will also reflect on you code location (It means it will Permanent change)
Thanks
对于 Mac 用户，请转至 Google Chrome --> 菜单查看 --> 开发人员 --> JavaScript 控制台。
For Mac users, go to Google Chrome --> menu View --> Developer --> JavaScript Console.
Windows 和 Linux：
Ctrl + Shift + I 键打开开发者工具
Ctrl + Shift kbd> + J 打开开发人员工具并将焦点移至控制台。
Ctrl + Shift + C 切换检查元素模式。
Mac：
⌥ + ⌘ + I 键打开开发者工具
⌥ + ⌘ + J 打开开发人员工具并将焦点移至控制台。
⌥ + ⌘ + C 切换检查元素模式。
来源
其他快捷方式
Windows and Linux:
Ctrl + Shift + I keys to open Developer Tools
Ctrl + Shift + J to open Developer Tools and bring focus to the Console.
Ctrl + Shift + C to toggle Inspect Element mode.
Mac:
⌥ + ⌘ + I keys to open Developer Tools
⌥ + ⌘ + J to open Developer Tools and bring focus to the Console.
⌥ + ⌘ + C to toggle Inspect Element mode.
Source
Other shortcuts
Windows：CTRL-SHIFT-J 或 F12
Mac：⌥-⌘- J
也可通过扳手菜单（工具 > JavaScript 控制台）使用：
Windows: CTRL-SHIFT-J OR F12
Mac: ⌥-⌘-J
Also available through the wrench menu (Tools > JavaScript Console):
尝试将其添加到您的源代码中：
它适用于大多数（如果不是所有）浏览器。 只需将它放在代码中的某个位置，它就会充当断点。
Try adding this to your source:
It works in most, if not all browsers. Just place it somewhere in your code, and it will act like a breakpoint.