Skip to content

Latest commit

 

History

History
40 lines (26 loc) · 1.11 KB

chrome-dev-tools.md

File metadata and controls

40 lines (26 loc) · 1.11 KB

Chrome Developer Tools

Console

Retrieving DOM Elements

Use $$('css-selector') ($$() is equivalent to document.querySelectorAll()).

This API returns an array, where you can easily call .map() on, etc. (in contrast to e.g. document.getElementsByClassName(), which returns an HTMLCollection, for which iterating is possible, but a pain in the butt.)

Example usage:

$$('h2').map(el => el.textContent);    // get all h2 headline texts

Negative filter (remove some entries)

Since Chrome 62 (see What's New in DevTools 62):

  • just use -toBeRemoved

Before Chrome 62:

  • enable Regex
  • ^((?!ToBeHidden|SomethingElse).)*$

Network

Exclude resources from Chrome Extensions (e.g. Vimium)

  • set filter to: larger-than:1 (the resources have no size, they are loaded from disk cache)