本文只介紹 Chrome 一些主要和常用的快捷鍵，在其它瀏覽器的開發者工具中可類比，大部分快捷鍵作用都相同，只有個別差異。
全局（所有面板）#
| 功能 | 快捷鍵 | 描述 |
|---|---|---|
| 打開開發者工具 | F12 / Ctrl + Shift + I | 普通打開 |
| 打開 Console | Ctrl + Shift + J | 打開工具並進入 Console 面板 |
| 檢查元素 | Ctrl + Shift + C | 進入 Elements 面板後開始選取頁面元素 |
| 開發者工具設置 | ?/F1 | 開發者工具的所有相關設置 |
| 切換上個面板 | Ctrl + [ | 向左切換一個面板 |
| 切換下個面板 | Ctrl + ] | 向右切換一個面板 |
| 切換工具停靠位置 | Ctrl + Shift + D | 即整個工具相對於瀏覽器的停靠位置，具體在懸浮、左側、右側、底部哪兩個間切換，取決於最近兩次操作 |
| 切換設備模式 | Ctrl + Shift + M | 普通模式和響應式設備編輯模式間切換 |
| 切換抽屜工具欄 | Esc | 切換顯示工具底部的彈出式工具欄，如 Console 等 |
| 刷新網頁 | F5/Ctrl + R | 普通刷新頁面，會讀取 memory cache 和 disk cache |
| 強制刷新 | Ctrl + F5/Ctrl + Shift + R | 禁用緩存刷新，類似於勾選 disable cache 後刷新 |
| 當前面板中搜索 | Ctrl + F | 當前面板中搜索文本，如 Elements, Console 等 |
| 所有資源中搜索 | Ctrl + Shift + F | 在當前網頁加載的所有資源（Sources）中搜索文本 |
| 按文件名搜索 | Ctrl + O/Ctrl + P | 同樣搜索所有資源，只是搜索對象限制在文件名稱上 |
| 放大字體 | Ctrl + + | 放大整個開發者工具的字體與圖形（不包括網頁） |
| 縮小字體 | Ctrl + - | 縮小開發者工具字體與圖形的尺寸 |
| 恢復字體大小 | Ctrl + 0 | 將開發者工具的字體與圖形尺寸恢復默認大小 |
Elements（元素）面板#
| 功能 | 快捷鍵 | 描述 |
|---|---|---|
| 撤消更改 | Ctrl + Z | 撤銷對 HTML 內容的修改 |
| 重做更改 | Ctrl + Y | 恢復撤銷前的修改 |
| 展開節點 | →（右方向鍵） | 展開當前折疊的 HTML 元素節點 |
| 折疊節點 | ←（左方向鍵） | 折疊當前展開的 HTML 元素節點 |
| 递归展開節點 | Alt + → | 递归地展開當前折疊的 HTML 元素節點 |
| 递归折疊節點 | Alt + ← | 递归地折疊當前展開的 HTML 元素節點 |
| 編輯節點屬性 | Enter | 編輯所在元素節點的屬性值（第一個屬性的） |
| 編輯下個屬性 | Tab | 按下 Enter 編輯屬性後，按 Tab 可以依次切換到後面的屬性 |
| 編輯上個屬性 | Shift + Tab | 切換到當前元素節點的上一个屬性值進行編輯 |
| 隱藏節點 | H | 在頁面中隱藏當前元素節點，實質是設置 visibility: hidden !important; 樣式 |
| 編輯 HTML | F2 | 以 HTML 的形式編輯當前元素節點內容，類似於右鍵菜單的 Edit as HTML |
| 編輯源樣式 | Ctrl + 點擊 | Style（樣式）欄中，Ctrl + 鼠標點擊 CSS 規則（選擇器、屬性或屬性值）時，會跳轉到源文件的相應位置 |
| 切換顏色類型 | Shift + 點擊 | Shift + 點擊樣式顏色值左邊的取色框時，色值類型會在 #, rgb(), hls() 之間切換 |
| 增 / 減數值 | ↑/↓（上、下方向鍵） | 單次增 / 減大小為 1 單位 |
| 0.1 倍增 / 減值 | Alt + ↑/Alt + ↓ | 單次增 / 減 0.1 倍單位值 |
| 10 倍增 / 減值 | Shift + ↑/Shift + ↓ | 單次增 / 減 10 倍單位值 |
| 100 倍增 / 減值 | Ctrl + ↑/Ctrl + ↓ | 單次增 / 減 100 倍單位值 |
Console（控制台）面板#
| 功能 | 快捷鍵 | 描述 |
|---|---|---|
| 清空輸出 | Ctrl + L | 清空控制台的歷史輸出 |
| 聚焦輸入 | Ctrl + ` （反引號） | 把輸入焦點聚焦到控制台輸入框中，其它面板中使用則打開 Console 抽屜欄 |
| 接受建議 | Enter/→ | 接受代碼提示的第一個建議項 |
| 切換命令 | ↑/↓ | 切換上 / 下一條歷史輸入命令 |
| 運行代碼 | Enter | 回車運行輸入的代碼 |
| 換行輸入 | Shift + Enter | 由於直接回車是運行代碼，所以想換行輸入需要加 Shift |
Sources（資源）面板#
| 功能 | 快捷鍵 | 描述 |
|---|---|---|
| 執行腳本 | F8/Ctrl + \ | 切換執行或暫停腳本 |
| 單步執行 | F10/Ctrl + ' | （Debugger 欄中 ）單步調試腳本 |
| 單步進入 | F11/Ctrl + ; | 單步進入調試（遇到函數就跳入） |
| 單步跳出 | Shift + F11/Ctrl + Shift + ; | 單步跳出調試（跳出當前函數） |
| 下個調用幀 | Ctrl + .（英文句號） | 調試時切換到調用棧（Call Stack 欄）中當前幀的下面一幀 |
| 上個調用幀 | Ctrl + ,（英文逗號） | 調試時切換到當前調用的幀上面一幀（當前為棧頂則忽略） |
| 輸出變量值 | Ctrl + Shift + E | 在控制台輸出編輯器中所選中的變量的值 |
| 觀察變量值 | Ctrl + Shift + A | 將編輯器中選中的變量值添加到 Watch 欄中 |
| 切換斷點 | Ctrl + B | 當焦點位於代碼編輯器中時，用於切換當前行是否設置為斷點 |
| 切換啟用斷點 | Ctrl + Shift + B | 切換當前行的斷點是否啟用（不會刪除斷點） |
| 切換啟用全部斷點 | Ctrl + F8 | 切換所有設置的斷點是否啟用 |
| 編輯斷點 | Ctrl + Alt + B | 編輯當前行的斷點類型（Breakpoint, Conditional Breakpoint, Logpoint） |
代碼編輯器（Sources 面板中）#
| 功能 | 快捷鍵 | 描述 |
|---|---|---|
| 切換註釋 | Ctrl + / | 為當前行或選中內容添加 / 取消註釋 |
| 保存修改 | Ctrl + S | 保存對文件的修改（需要先啟用側欄的 Overrides 功能） |
| 保存所有更改 | Ctrl + Alt + S | 保存編輯器打開的所有文件，同樣需要啟用 Overrides |
| 轉到匹配括號 | Ctrl + M | 跳轉到與當前光標位置的括號匹配的另一個括號處 |
| 添加匹配項 | Ctrl + D | 跳轉並添加選擇下一個與選擇文本匹配的文本 |
| 撤銷匹配項 | Ctrl + U | 返回並撤銷選擇一個匹配項，與 Ctrl + D 相反 |
| 轉到行 | Ctrl + G | 跳轉到指定行數 |
| 轉到成員 | Ctrl + Shift + O | 跳轉到當前文件中的指定成員函數 |
| 上個編輯處 | Alt + - | 跳轉到上個光標位於的編輯位置 |
| 下個編輯處 | Alt + + | 跳轉到下個編輯位置 |
| 關閉活動標籤 | Alt + W | 關閉當前編輯的標籤（文件） |
| 增 / 減 CSS 值 | Alt + ↑/Alt +↓ | 編輯 CSS 源文件時，可對當前數值增 / 減 1 一個單位 |
| 10 倍增 / 減 CSS 值 | Alt + PageUp↑/Alt + PageDown | CSS 中對當前數值增 / 減 10 一個單位 |