How To Scrape Website Data With the JavaScript Console

Want to grab some data from the Web? It’s easy via the JavaScript console.

Step 1. Navigate to your target page

Open your browser and navigate to the page you want to extract data from. In this case its Metacritic.

Step 2. Open the JavaScript console

Open the JavaScript console. On most browsers you can do this with a keyboard shortcut: F12. If the shortcut doesn’t work, Open it from the Developer or Tools menu.

Step 3. Issue a DOM query

A Document Object Model (DOM) query can be used to interrogate the page and extract data.

In this case I made two queries to extract game titles and scores from Metacritic, saving the result into two string variables: titles and scores

$$('.c-finderProductCard_titleHeading').forEach(function(element) { titles += element.children[1].innerHTML + "\n"; })

$$('.c-siteReviewScore').forEach(function(element) { scores += element.children[0].innerHTML + "\n"; })

Step 4. Copy paste to save structured data

With the query done, just print and copy your structured data to the clipboard. Enjoy!