JavaScript querySelector() Method Tutorial

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.

More to Read

JavaScript querySelectorAll() Method

Leave a Reply