chrome console 的快捷键 ( shortcuts in chrome developer tools)
访问量: 3902
refer to: F12 -> 小齿轮 -> 点击 shortcuts 就是。 也可以看： https://developer.chrome.com/devtools/docs/shortcuts
几个我最想要的功能：
console 下： 使用 代码补全： ->
切换各个小tab: ctrl + [, ctrl + ]
style下， 增加、减少数值： shift + up/down （每次加10)
Keyboard Shortcuts
The DevTools has several built-in shortcut keys that developers can use to save time in their day to day workflow. Outlined below is each shortcut and the corresponding key for each on Windows/Linux and Mac. While some shortcuts are globally available across all of the DevTools, others are specific to a single panel, and are broken up based on where it can be used.
Opening DevTools #
To access the DevTools, on any web page or app in Google Chrome you can use one of these options:
- Open the Chrome menu
at the top-right of your browser window, then select Tools > Developer Tools. - Right-click on any page element and select Inspect Element.
| Windows / Linux | Mac | |
|---|---|---|
| Open Developer Tools | F12, Ctrl + Shift + I | Cmd + Opt + I |
| Open / switch from inspect element mode and browser window | Ctrl + Shift + C | Cmd + Shift + C |
| Open Developer Tools and bring focus to the console | Ctrl + Shift + J | Cmd + Opt + J |
| Inspect the Inspector (undock first one and press) | Ctrl + Shift + I | Cmd + Opt + I |
To open up the General Settings dialog type ? or F1 when the Developer Tools window is open. Press Esc to close the settings dialog.
All Panels #
| Windows / Linux | Mac | |
|---|---|---|
| Show General Settings dialog | ?, F1 | ? |
| Next panel | Ctrl + ] | Cmd + ] |
| Previous panel | Ctrl + [ | Cmd + [ |
| Backward in panel History | Ctrl + Alt + [ | Cmd + Alt + [ |
| Forward in panel history | Ctrl + Alt + ] | Cmd + Alt + ] |
| Open Device Mode (v38+) | Ctrl + Shift + M | Cmd + Shift + M |
| Toggle Console / close settings dialog when open | Esc | Esc |
| Refresh the page | F5, Ctrl + R | Cmd + R |
| Refresh the page ignoring cached content | Ctrl + F5, Ctrl + Shift + R | Cmd + Shift + R |
| Text search within current file or panel | Ctrl + F | Cmd + F |
| Text search across all sources | Ctrl + Shift + F | Cmd + Alt + F |
| Search by filename (except on Timeline) | Ctrl + O, Ctrl + O | Cmd + O, Cmd + O |
| Zoom in (while focused in DevTools) | Ctrl + + | Shift + + |
| Zoom out | Ctrl + - | Shift + - |
| Restore default text size | Ctrl + 0 | Shift + 0 |
Elements Panel #
| Windows / Linux | Mac | |
|---|---|---|
| Undo change | Ctrl + Z | Cmd + Z |
| Redo change | Ctrl + Y | Cmd + Y, Cmd + Shift + Z |
| Navigate | Up, Down | Up, Down |
| Expand / collapse node | Right, Left | Right, Left |
| Expand node | Single-click on tag | Single-click on tag |
| Expand / collapse node and all its children | Ctrl + Alt + Click on arrow icon | Opt + Click on arrow icon |
| Edit attribute | Enter, Double-click on attribute | Enter, Double-click on attribute |
| Hide element | H | H |
| Toggle edit as HTML | F2 |
Right-clicking an element you can:
- Force element pseudo states: (
:active,:hover,:focus,:visited) - Set breakpoints on the elements: (Subtree modifications, Attribute modification, Node removal)
- Clear console
Styles Sidebar #
| Windows / Linux | Mac | |
|---|---|---|
| Edit rule | Single-click | Single-click |
| Insert new property | Single-click on whitespace | Single-click on whitespace |
| Go to line of style rule property declaration in source | Ctrl + Click on property | Cmd + Click on property |
| Go to line of property value declaration in source | Ctrl + Click on property value | Cmd + Click on property value |
| Cycle through the color definition value | Shift + Click on color picker box | Shift + Click on color picker box |
| View auto-complete suggestions | Ctrl + Space | Cmd + Space |
| Edit next / previous property | Tab, Shift + Tab | Tab, Shift + Tab |
| Increment / decrement value | Up, Down | Up, Down |
| Increment / decrement value by 10 | Shift + Up, Shift + Down | Shift + Up, Shift + Down |
| Increment / decrement value by 10 | PgUp, PgDown | PgUp, PgDown |
| Increment / decrement value by 100 | Shift + PgUp, Shift + PgDown | Shift + PgUp, Shift + PgDown |
| Increment / decrement value by 0.1 | Alt + Up, Alt + Down | Opt + Up, Opt + Down |
Emulate an element's pseudo state (:active, :hover, :focus, :visited)
Add new style selectors
Sources Panel #
| Windows / Linux | Mac | |
|---|---|---|
| Pause / resume script execution | F8, Ctrl + \ | F8, Cmd + \ |
| Step over next function call | F10, Ctrl + ' | F10, Cmd + ' |
| Step into next function call | F11, Ctrl + ; | F11, Cmd + ; |
| Step out of current function | Shift + F11, Ctrl + Shift + ; | Shift + F11, Cmd + Shift + ; |
| Select next call frame | Ctrl + . | Opt + . |
| Select previous call frame | Ctrl + , | Opt + , |
| Toggle breakpoint condition | Click on line number, Ctrl + B | Click on line number, Cmd + B |
| Edit breakpoint condition | Right-click on line number | Right-click on line number |
| Delete individual words | Alt + Delete | Opt + Delete |
| Comment a line or selected text | Ctrl + / | Cmd + / |
| Save changes to local modifications | Ctrl + S | Cmd + S |
| Save all changes | Ctrl + Alt + S | Cmd + Opt + S |
| Go to line | Ctrl + G | Ctrl + G |
| Search by filename | Ctrl + O | Cmd + O |
| Jump to line number | Ctrl + P + :<number> | Cmd + P + :<number> |
| Jump to column | Ctrl + O + :<number> + :<number> | Cmd + O + :<number> + :<number> |
| Go to member | Ctrl + Shift + O | Cmd + Shift + O |
| Toggle console and evaluate code selected in Sources panel | Ctrl + Shift + E | Cmd + Shift + E |
| Close active tab | Alt + W | Opt + W |
| Run snippet | Ctrl + Enter | Cmd + Enter |
| Toggle comment | Ctrl + / | Cmd + / |
Don't pause on exceptions
Pause on All exceptions (including those caught within try/catch blocks)
Pause on uncaught exceptions (usually the one you want)
Timeline Panel #
| Windows / Linux | Mac | |
|---|---|---|
| Start / stop recording | Ctrl + E | Cmd + E |
| Save timeline data | Ctrl + S | Cmd + S |
| Load timeline data | Ctrl + O | Cmd + O |
Profiles Panel #
| Windows / Linux | Mac | |
|---|---|---|
| Start / stop recording | Ctrl + E | Cmd + E |
Console #
| Windows / Linux | Mac | |
|---|---|---|
| Next suggestion | Tab | Tab |
| Previous suggestion | Shift + Tab | Shift + Tab |
| Accept suggestion | Right | Right |
| Previous command / line | Up | Up |
| Next command / line | Down | Down |
| Focus the Console | Ctrl + ` | Ctrl + ` |
| Clear Console | Ctrl + L | Cmd + K, Opt + L |
| Multi-line entry | Shift + Enter | Ctrl + Return |
| Execute | Enter | Return |
Right-clicking on console:
- XMLHTTPRequest logging: Turn on to view the XHR log
- Preserve log upon navigation
- Filter: Hide and unhide messages from script files
- Clear console: Clear all console messages
Screencasting #
| Windows / Linux | Mac | |
|---|---|---|
| Pinch zoom in and out | Alt + Scroll,Ctrl + Cick and drag with two fingers | Opt + Scroll, Cmd + Cick and drag with two fingers |
| Inspect element tool | Ctrl + Shift + C | Cmd + Shift + C |
Emulation #
| Windows / Linux | Mac | |
|---|---|---|
| Pinch zoom in and out | Shift + Scroll | Shift + Scroll |
Other Chrome Shortcuts #
Here are some additional Chrome shortcuts which are useful for general use within the browser not specific to the DevTools. View all Chrome shortcuts for Windows, Mac, and Linux.
| Windows / Linux | Mac | |
|---|---|---|
| Find next | Ctrl + G | Cmd + G |
| Find previous | Ctrl + Shift + G | Cmd + Shift + G |
| Open a new window in Incognito mode | Ctrl + Shift + N | Cmd + Shift + N |
| Toggle Bookmarks bar on and off | Ctrl + Shift + B | Cmd + Shift + B |
| View the History page | Ctrl + H | Cmd + Y |
| View the Downloads page | Ctrl + J | Cmd + Shift + J |
| View the Task Manager | Shift + ESC | Shift + ESC |
| Next page in a tabs browsing history | Alt + Right | Alt + Right |
| Previous page in a tabs browsing history | Backspace, Alt + Left | Backspace, Alt + Left |
| Highlight content in the web address area | F6, Ctrl + L, Alt + D | Cmd + L, Alt + D |
| Places a ? in the address bar for performing a keyword search using your default search engine |
Ctrl + K, Ctrl + E | Cmd + K, Cmd + E |