注：本文测试、截图均为Edge浏览器（内核是Chromium），浏览器内核可了解《有哪些浏览器/内核？[1]》
00、基础操作汇总
| 操作类型 | 快捷键/说明 |
|---|---|
| 切换浏览器标签 | 🔸 Ctrl+1到8切换到对应序号的浏览器标签 🔸 Ctrl+PgUp/PgDn标签页左右切换 |
| 浏览器全屏 | F11 (⌘ + shift + F Mac) |
| 打开调试模式 | 🔸 F12，Ctrl + Shift + I (Windows) 或 Cmd + Opt + I (Mac) 🔸 页面右键菜单“检查”，浏览器菜单“开发者工具” |
| 切换调试工具位置（下面、右边） | ctrl + shift + D (⌘ + shift + D Mac) |
| 切换 DevTools 的面板标签 | ctrl + [ 和 ctrl + ]左右切换调试工具面板 |
| 内容搜索查找 | Ctrl+F：元素、控制台、源代码、网络都支持搜索查找 |
| 使用命令Command面板 | Ctrl] + [Shift] + [P] （Mac： [⌘] + [Shift]+ [P]） 类似VSCode的命令面板，有大量的隐藏功能，可以在这里搜索使用 |
| 复制元素 | 🔸 元素面板：选中元素》Ctrl+C 🔸 元素面板：选中元素》右键菜单》复制元素 🔸 copy($0) 控制台中代码复制当前选中元素 |
| 控制台：快速访问当前元素'$0' | $0代表在元素面板中选中元素，$1是上一个，支持到$4 |
控制台：全局copy方法 |
复制任何对象到剪切板，copy(window.location) |
| 控制台：queryObjects(Type) | 查询指定类型（构造器）的对象实例有哪些 |
| 控制台：保存堆栈信息( Stack trace ) | 报错信息可以右键另存为文件，保存完整堆栈信息 |
控制台：$、$$查询Dom元素 |
- $ = document.querySelector - $$ = document.querySelectorAll |
| Store as global（存储为全局变量） | 🔸 控制台（右键）：把一个对象设置为全局变量，自动命名为temp* 🔸 元素面板（右键）：把一个元素设置全局变量，同上 |
元素：h快速隐藏、显示该元素 |
选中元素，按下h快速隐藏、显示该元素。 |
| 元素：移动元素 | 🔸 鼠标拖动到任意位置 🔸 上下移动，[ctrl] + [⬆] / [ctrl] + [⬇] （[⌘] + [⬆] / [⌘] + [⬇]on Mac） |
🔸Store as global（存储为全局变量）：类似copy方法，将一个对象保存为全局变量，变量命名依次为temp1、temp2。
**🔸保存堆栈信息( Stack trace )**：错误堆栈信息另存为文件，保存完整堆栈信息。
🔸Command面板：同VSCode的命令面板，可以找到调试工具的所有的（隐藏）功能。Ctrl] + [Shift] + [P]（Mac： [⌘] +
扫一扫
3204
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
