Creating a Simple Web Scraping Function in Vanilla JS

  • npm init -y: npm init creates/initializes a new npm project, and -y means to default all answers to yes. This is a simple way to create a place for all your packages and dependencies to go.
For this example I’m using the online store of a local surf shop.
  • The $x method evaluates our chosen XPath on the page, and returns an element to the array.
  • Next, we’re extracting the image URL using by using getProperty to extract the src
  • Finally, we need to convert our retrieved code into a readable format using jsonValue.




Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

NumPy 2D array

Next JS

Best Javascript Array Methods for Angular Projects

Is Breakfast The Most Important Meal of The Day? ( I call bull shit!)

How to Style Your Twitter Widget + Styling on Shadow DOM

Create a 3D heart for valentine’s day with Three.js

5 Useful JavaScript Time and Date Manipulation Libraries

Integrate Stripe Terminal Payments into your React Native application

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store


More from Medium

Developers’ inseparable toolkit: Part 2, GIT

5 Most Popular Applications of Machine Learning in Game Development

Machine Learning App Development

Web Servers | ESP32

Learning With Lists: Putting Basic-Level JavaScript Knowledge to Use.