So let's go ahead and select this element and get the output inside of a console tab.
So open chrome developer tools and select the console tab.
Then write out this code here.
Const.
A one element is equal to document dot query selector.
And right in each one.
And then let's see what the A1 element looks like.
It is the HTML element that we selected using the H1 tag or element tag, so to say.
Now remember that when we looked inside of this element with the select or inspect element feature,
we could see that it was an H1 element.
So using that, we can then select the element and then we can output the text via the console.
So we can say text content and then we have the text content of this element.
These things we can then use to execute inside of NodeJS so we can have a little script running on a
server that goes to a page and then it selects the element and gets the text.
But there is a easier way of getting elements than doing all of this.
Let me show you how to do that.
We use jQuery selectors instead of these vanilla JavaScript selectors.
So jQuery is a library for JavaScript that was quite popular some years ago.
Now it's not so popular because we have things like React and Angular for making web apps, but we can
still use jQuery to select elements and it's quite handy to do that compared to using vanilla JavaScript
selectors.
So up here I have a little plugin that is injecting jQuery into a site.
I do not have jQuery on this site already.
Some pages already have jQuery in them.
But you're going to come onto some sites that don't have jQuery installed already.
So you can Google inject jQuery, Chrome.
And then there's this first result I have here, and you can just install that jQuery inject.
Then up here I get this little handy extension plug in here where I can just click on it.
And now jQuery is injected into this page so I can use jQuery features.
So that means I can simply type in a dollar sign and then put in my CSS selector, which is going to
be H1.
And then you can put in a dot text to get the text from this element.
See how easy that is compared to all of this where we first select the element.
And then we get the text content.
So the equivalent in vanilla JavaScript would be to write Document.queryselector.
Each one takes content.
The point I'm trying to say here is that we're using jQuery because it makes things a lot easier for
us.
This is going to be a lot easier to use compared to the vanilla JavaScript.
So with that being said, I hope you now got the jQuery plugin installed and you got this selection
of the elements successfully working.