In this section, we will learn what the document querySelector() method is and how to use it in JavaScript.
What is document querySelector() Method in JavaScript
The JavaScript document querySelector() method is used to select an element in an HTML document and bring a reference of that element into JavaScript using CSS Selectors.
Note: this method only returns the first element that matched the specified CSS selector that was set as the argument of the method.
document querySelector() Method Syntax
document.querySelector(CSS-Selector);
document querySelector() Method Parameters
The method takes one argument and that is the query selector we specify using CSS Selectors.
document querySelector() Method Return Value
The return value of this method is a reference to the first element that matched the specified query.
Note: the method might return the value null if no match was found for the defined query.
Example: using document querySelector() Method in JavaScript
See the Pen using document querySelector() Method in JavaScript by Omid Dehghan (@odchan1) on CodePen.