该页面提供了一个Chrome开发者工具(DevTools)的使用技巧速查表,包括多种调试操作、网络监控、性能分析等功能的使用技巧。
Elements 面板
| 操作 |
快捷键 |
| 打开 DevTools |
F12 或 Ctrl + Shift + I |
| 切换设备工具栏 |
Ctrl + Shift + M |
| 刷新并清空缓存 |
Ctrl + Shift + R |
| 查看元素的上下文菜单 |
右键 |
| 编辑元素 |
Enter |
| 删除元素 |
Delete |
| 复制元素 |
Ctrl + C |
| 粘贴元素 |
Ctrl + V |
| 查看元素的 CSS 规则 |
Ctrl + Shift + C |
Console 面板
| 操作 |
快捷键 |
| 打开控制台 |
Esc |
| 清空控制台 |
Ctrl + L |
| 复制选中的文本 |
Ctrl + C |
| 粘贴文本 |
Ctrl + V |
| 查看命令历史 |
上箭头 和 下箭头 |
| 查看对象的详细信息 |
Ctrl + Shift + C |
Network 面板
| 操作 |
快捷键 |
| 开始/停止记录网络活动 |
Ctrl + E |
| 清空网络日志 |
Ctrl + R |
| 过滤请求 |
Ctrl + F |
| 查看请求的详细信息 |
Ctrl + Shift + C |
| 操作 |
快捷键 |
| 开始/停止录制性能 |
Ctrl + E |
| 导出录制的性能 |
Ctrl + S |
| 过滤事件 |
Ctrl + F |
Memory 面板
| 操作 |
快捷键 |
| 拍摄快照 |
Ctrl + S |
| 导出快照 |
Ctrl + Shift + S |
| 过滤快照 |
Ctrl + F |
Application 面板
| 操作 |
快捷键 |
| 刷新应用程序 |
Ctrl + R |
| 清除存储 |
Ctrl + Shift + R |
| 过滤数据 |
Ctrl + F |
Security 面板
| 操作 |
快捷键 |
| 查看证书 |
Ctrl + Shift + C |
| 重新加载页面并绕过缓存 |
Ctrl + Shift + R |
Misc
| 操作 |
快捷键 |
| 打开设置 |
F1 |
| 切换主题 |
Ctrl + Shift + P 然后输入 theme |
| 查看快捷键 |
Ctrl + Shift + P 然后输入 shortcuts |