DEV Community

Vinoth Kumar
Vinoth Kumar

Posted on

QUERYSELECTORS

QUERYSELECTORS() :

Returns the first element that matches the specified Selector. It only gives one element from the HTML DOM if found else it returns null.

SYNTAX:
document.querySelector(selectors);

EXAMPLE:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>dynamic font size changer -</title>
</head>
<body>
    <input type="range" min = "10" max="50" value="17" oninput="changefont(this.value)">
    <h1 id="text">hello myself vinoth</h1>

    <script>

        function changefont(size){
            const heading = document.getElementById("text");
            heading.style.fontSize = size + "px";
        }
    </script>
</body>
</html>
Enter fullscreen mode Exit fullscreen mode

Return value: First element that matches the selectors if found else null.

selectors: A string containing the CSS Selectors.

Top comments (0)