Now we will learn how to get the page DOM elements in order to perform some manipulations with them in the future.
Let's have some button:
<input id="button" type="submit">
Let's get a reference to this button into
a variable. To do this, use the querySelector
method of the special object document
.
This method takes a CSS selector as a parameter
and returns a reference to the element found
with this selector.
Our button has an attribute id
with
the value button
. So we can find
this button by the selector #button
.
So, let's find our button and write a
reference to it into a variable:
let button = document.querySelector('#button');
console.log(button);
Given 3
paragraphs:
<p id="elem1">1</p>
<p id="elem2">2</p>
<p id="elem3">3</p>
Put the reference to each of the paragraphs in a separate variable and print the contents of each of these variables to the console.