Most used DevTools shortcuts

Hash - Aug 28 '22 - - Dev Community

Using shortcuts makes you faster and a productive developer

Here are some shortcuts I found them useful.

1. Command+Option+I

it opens the last opened panel

2. h

it hides the currently-selected element

3. Command+EE

it clears the network logs

4. ESC

It pulls up the console on any tab

Some Shortcuts in Console

2. $

it equals to

document.querySelector
Enter fullscreen mode Exit fullscreen mode

3. $$

it equals to

document.querySelectorAll
Enter fullscreen mode Exit fullscreen mode

4. $x

it equals to

document.querySelector with xPath
Enter fullscreen mode Exit fullscreen mode

5.$0, $1, ...

$0 It exactly returns the element in the elements' inspector that you selected. (current element)

$1 it returns the previous element
$2 it returns the two previous element

6. Command + K

it equals to

clear()
Enter fullscreen mode Exit fullscreen mode

Here also a video playlist of devtools tips will be updated gradually:

favicon youtube.com

let me know which else do you use regularly, share them in the comments

Best

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Terabox Video Player