此文章是 Chrome DevTools 中键盘快捷键的参考。
将鼠标悬停在 DevTools 的 UI 元素上以显示其工具提示。如果元素有快捷方式,工具提示会包含它。
用于打开 DevTools 的键盘快捷键 要打开 DevTools,请在光标聚焦在浏览器视口上时按以下键盘快捷键:
行动 |
苹果电脑 |
视窗/Linux |
打开您上次使用的任何面板 |
Command+ Option+I |
F12或Control+ Shift+I |
打开控制台面板 |
Command+ Option+J |
Control+ Shift+J |
打开元素面板 |
Command+ Shift+C或Command+ Option+C |
Control+ Shift+C |
全局键盘快捷键
【chrome|Chrome DevTools 中键盘快捷键的参考。】大多数(如果不是全部)DevTools 面板中都提供以下键盘快捷键。
行动 |
苹果电脑 |
视窗/Linux |
显示设置 |
?或Function+F1 |
? 或者 F1 |
聚焦下一个面板 |
Command+] |
Control+] |
聚焦上一个面板 |
Command+[ |
Control+[ |
切换回您上次使用的任何停靠位置。如果 DevTools 在整个会话中一直处于默认位置,则此快捷方式会将 DevTools 取消停靠到单独的窗口中 |
Command+ Shift+D |
Control+ Shift+D |
切换设备模式 |
Command+ Shift+M |
Control+ Shift+M |
切换检查元素模式 |
Command+ Shift+C |
Control+ Shift+C |
打开命令菜单 |
Command+ Shift+P |
Control+ Shift+P |
切换抽屉 |
Escape |
Escape |
正常重装 |
Command+R |
F5或Control+R |
硬重装 |
Command+ Shift+R |
Control+F5或Control+ Shift+R |
在当前面板中搜索文本。在审计、应用程序和安全面板中不受支持 |
Command+F |
Control+F |
在Drawer 中打开Search选项卡,可让您在所有加载的资源中搜索文本 |
Command+ Option+F |
Control+ Shift+F |
在“源”面板中打开文件 |
Command+O或Command+P |
Control+O或Control+P |
放大 |
Command+ Shift++ |
Control+ Shift++ |
缩小 |
Command+- |
Control+- |
恢复默认缩放级别 |
Command+0 |
Control+0 |
运行代码段 |
按Command+O打开Command Menu,键入!后跟脚本的名称,然后按Enter |
按Control+O打开Command Menu,键入!后跟脚本的名称,然后按Enter |
元素面板键盘快捷键
行动 |
苹果电脑 |
视窗/Linux |
撤消更改 |
Command+Z |
Control+Z |
重做更改 |
Command+ Shift+Z |
Control+Y |
选择当前所选元素上方/下方的元素 |
Up Arrow / Down Arrow |
Up Arrow / Down Arrow |
展开当前选择的节点。如果节点已经展开,这个快捷方式选择它下面的元素 |
Right Arrow |
Right Arrow |
折叠当前选择的节点。如果节点已经折叠,这个快捷方式选择它上面的元素 |
Left Arrow |
Left Arrow |
展开或折叠当前选定的节点及其所有子节点 |
按住Option然后单击元素名称旁边的箭头图标 |
按住Control+Alt然后单击元素名称旁边的箭头图标 |
在当前选择的元素上切换编辑属性模式 |
Enter |
Enter |
进入编辑属性模式后选择下一个/上一个属性 |
Tab/ Shift+Tab |
Tab/ Shift+Tab |
隐藏当前选中的元素 |
H |
H |
在当前选定的元素上切换编辑为 HTML模式 |
Function+F2 |
F2 |
样式面板键盘快捷键
行动 |
苹果电脑 |
视窗/Linux |
转到声明属性值的行 |
按住Command然后单击属性值 |
按住Control然后单击属性值 |
循环浏览颜色值的 RBGA、HSLA 和十六进制表示 |
按住Shift然后单击值旁边的颜色预览框 |
按住Shift然后单击值旁边的颜色预览框 |
选择下一个/上一个属性或值 |
单击属性名称或值,然后按Tab/ Shift+Tab |
单击属性名称或值,然后按Tab/ Shift+Tab |
将属性值增加/减少 0.1 |
单击一个值,然后按Option+ Up Arrow/ Option+Down Arrow |
单击一个值,然后按Alt+ Up Arrow/ Alt+Down Arrow |
将属性值增加/减少 1 |
单击一个值,然后按Up Arrow/Down Arrow |
单击一个值,然后按Up Arrow/Down Arrow |
将属性值增加/减少 10 |
单击一个值,然后按Shift+ Up Arrow/ Shift+Down Arrow |
单击一个值,然后按Shift+ Up Arrow/ Shift+Down Arrow |
将属性值增加/减少 100 |
单击一个值,然后按Command+ Up Arrow/ Command+Down Arrow |
单击一个值,然后按Control+ Up Arrow/ Control+Down Arrow |
循环显示角度值的度数 (deg)、梯度 (grad)、弧度 (rad) 和转弯 (turn) 表示 |
按住Shift然后单击值旁边的角度预览框 |
按住Shift然后单击值旁边的角度预览框 |
将角度值增加/减少 1 |
单击值旁边的角度预览框,然后按Up Arrow/Down Arrow |
单击值旁边的角度预览框,然后按Up Arrow/Down Arrow |
将角度值增加/减少 10 |
单击值旁边的角度预览框,然后按Shift+ Up Arrow/ Shift+Down Arrow |
单击值旁边的角度预览框,然后按Shift+ Up Arrow/ Shift+Down Arrow |
将角度值增加/减少 15 |
单击值旁边的角度预览框,然后按Shift,在角度时钟叠加上单击/鼠标滑动 |
单击值旁边的角度预览框,然后按Shift,在角度时钟叠加上单击/鼠标滑动 |
源面板键盘快捷键
行动 |
苹果电脑 |
视窗/Linux |
暂停脚本执行(如果当前正在运行)或恢复(如果当前暂停) |
F8或Command+\ |
F8或Control+\ |
跳过下一个函数调用 |
F10或Command+' |
F10或Control+' |
进入下一个函数调用 |
F11或Command+;
|
F11或Control+;
|
跳出当前功能 |
Shift+F11或Command+ Shift+;
|
Shift+F11或Control+ Shift+;
|
暂停时继续执行某一行代码 |
按住Command然后单击代码行 |
按住Control然后单击代码行 |
选择当前选定框架下方/上方的调用框架 |
Control+ ./ Control+, |
Control+ ./ Control+, |
保存对本地修改的更改 |
Command+S |
Control+S |
保存所有更改 |
Command+ Option+S |
Control+ Alt+S |
去线 |
Control+G |
Control+G |
跳转到当前打开文件的行号 |
按Command+O打开命令菜单,键入:后跟行号,然后按Enter |
按Control+O打开命令菜单,键入:跟随的行号,然后按Enter |
跳转到当前打开文件的一列(例如第 5 行,第 9 列) |
按Command+O打开命令菜单,键入:,然后是行号,然后是另一个:,然后是列号,然后按Enter |
按Control+O打开命令菜单,键入:,然后是行号,然后是另一个:,然后是列号,然后按Enter |
转到函数声明(如果当前打开的文件是 HTML 或脚本)或规则集(如果当前打开的文件是样式表) |
按Command+ Shift+ O,然后输入声明/规则集的名称,或从选项列表中选择它 |
按Control+ Shift+ O,然后输入声明/规则集的名称,或从选项列表中选择它 |
关闭活动选项卡 |
Option+W |
Alt+W |
代码编辑器键盘快捷键
行动 |
苹果电脑 |
视窗/Linux |
删除最后一个单词中的所有字符,直到光标 |
Option+Delete |
Control+Delete |
添加或删除代码行断点 |
将光标放在该行上,然后按Command+B |
将光标放在该行上,然后按Control+B |
转到匹配的括号 |
Control+M |
Control+M |
切换单行注释。如果选择了多行,DevTools 会在每行的开头添加注释 |
Command+/ |
Control+/ |
选择/取消选择光标所在的下一个单词。每个事件同时突出显示 |
Command+ D/ Command+U |
Control+ D/ Control+U |
性能面板键盘快捷键
行动 |
苹果电脑 |
视窗/Linux |
开始/停止录音 |
Command+E |
Control+E |
保存录音 |
Command+S |
Control+S |
载入录音 |
Command+O |
Control+O |
内存面板键盘快捷键
行动 |
苹果电脑 |
视窗/Linux |
开始/停止录音 |
Command+E |
Control+E |
控制台面板键盘快捷键
行动 |
苹果电脑 |
视窗/Linux |
接受自动完成建议 |
Right Arrow 或者 Tab |
Right Arrow 或者 Tab |
拒绝自动完成建议 |
Escape |
Escape |
获取之前的声明 |
Up Arrow |
Up Arrow |
获取下一条语句 |
Down Arrow |
Down Arrow |
聚焦控制台 |
Control+` |
Control+` |
清除控制台 |
Command+K或Option+L |
Control+L |
强制多行输入。请注意,DevTools 默认应该检测多行场景,所以现在通常不需要这个快捷方式 |
Command+Return |
Shift+Enter |
执行 |
Return |
Enter |
展开已记录到控制台的对象的所有子属性 |
按住Alt然后单击展开 |
按住Alt然后单击展开 |
推荐阅读