使用Google Chrome浏览器时,我想调试一些JavaScript代码。 我怎样才能做到这一点?
#1楼
F12功能键以启动JavaScript调试器,然后单击“脚本”。
选择顶部的JavaScript文件,并将断点放置到调试器以获取JavaScript代码。
#2楼
在Chrome的控制台中,您可以执行console.log(data_to_be_displayed) 。
#3楼
Ctrl + Shift + J打开开发人员工具。
#4楼
对于Mac用户,请转到Google Chrome浏览器->菜单视图 -> 开发人员 -> JavaScript控制台 。
#5楼
要打开专用的“控制台”面板,请执行以下任一操作:
- Ctrl + Shift + J
- Cmd + Option + J
- 选择Chrome菜单图标,菜单-> 更多工具 -> JavaScript控制台 。 或者,如果Chrome开发者工具已经打开,请press “控制台”标签。
请参考这里
#6楼
在Mac上的Chrome 8.0.552中,您可以在菜单View / Developer / JavaScript Console ...下找到它,也可以使用Alt + CMD + J。
#7楼
现在,谷歌浏览器引入了新功能。 通过使用此功能,您可以在chrome浏览器中编辑代码。 (永久更改代码位置)
为此,请按F12->“源”选项卡-(右侧)->“文件系统”,请选择您的代码位置。 然后chrome浏览器会征求您的许可,然后该代码将以绿色下沉。 并且您可以修改您的代码,它也会反映在您的代码位置(这意味着它将永久更改)
谢谢
#8楼
Windows和Linux:
Ctrl + Shift + I键打开开发人员工具
Ctrl + Shift + J打开开发人员工具并将焦点移到控制台。
Ctrl + Shift + C切换检查元素模式。
苹果电脑:
⌥ + ⌘ + I键打开开发人员工具
⌥ + ⌘ + J打开开发人员工具并将焦点移到控制台。
⌥ + ⌘ + C切换检查元素模式。
资源
其他捷径
#9楼
我发现进入javascript调试器的最有效方法是运行以下命令:
chrome://inspect
#10楼
在这里,您可以找到访问开发人员工具的快捷方式。
https://developer.chrome.com/devtools/docs/shortcuts
#11楼
F12打开开发人员面板
CTRL + SHIFT + C将打开“悬停检查”工具,当您悬停时它将突出显示元素,您可以单击以在“元素”选项卡中显示它。
CTRL + SHIFT + I使用控制台选项卡打开开发人员面板
右键单击>检查右键单击任何元素,然后单击“检查”以在“开发人员”面板的“元素”选项卡中将其选中。
ESC如果右键单击并检查元素或类似元素,然后在“元素”选项卡中查看DOM,则可以按ESC上下切换控制台,这是同时使用两者的一种好方法。
#12楼
这些是您看到的工具
按F12
#13楼
尝试将其添加到您的源中:
debugger;
它适用于大多数(如果不是全部)浏览器。 只需将其放置在代码中的某个位置,它将像断点一样工作。
#14楼
Ctrl - Shift - J或F12
⌥ - ⌘ - J
也可以通过扳手菜单(工具> JavaScript控制台)使用:
#15楼
Shift + Control + 我打开“开发人员”工具窗口。 从左下角的第二个图像(如下所示)将为您打开/隐藏控制台: