Things you probably didn’t know you could do with Chrome’s Developer Console

Collection of useful tools in the Chrome JavaScript console.

Make the whole page editable

This is not special to Chrome, but still a clever thing:

document.body.contentEditable=true 

Taking time

You can easily measure the time on the console with named timers:

console.time('myTime'); // Start timer
console.timeEnd('myTime'); // End timer and print the time

Reference previously inspected elements (from the Elements panel)

Variables $0, $1, ... $n reference the nth-last inspected Element. $0 is the element that's currently selected in the Elements panel.

Inspect elements

inspect() and dir() help with inspecting elements. While inspect() does just what Right Click > Inspect does, dir() turns elements into objects that hold their properties. Try dir($0).

Reference the previous result

$_