jQuery [attribute] Selector

jQuery [attribute] Selector

Last Updated : 27 Jun, 2023

The [attribute] Selector is an inbuilt selector in jQuery, used to select all the elements with the specified attribute. Syntax:

$("[attribute_name]")

Parameter:

attribute_name: It is the required parameter which specify the attribute to be select.

Example-1:

html

<!DOCTYPE html>
<html>

<head>
    <script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
    </script>
  
    <script>
        $(document).ready(function() {
            $("[class]").css("color",
                             "green");
        });
    </script>
</head>

<body>
    <center>

        <!-- Class attribute-->

        <h3 class>GeeksforGeeks</h3>
        <p>A computer science portal for geeks</p>

        <!--id attribute-->

        <p id>Geek1</p>

        <!--class attribute-->

        <p class>Geek2</p>
        <p>Geek3</p>

        <!--class attribute-->

        <div class> Thank You! </div>

    </center>
</body>

</html>

Output:

In the above example, all the elements with the specified attribute (class) are formatted into green color i.e, "GeeksforGeeks", "Geek2" and "Thank You!". Example-2: html

<!DOCTYPE html>
<html>

<head>
    <script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
    </script>
  
    <script>
        $(document).ready(function() {
            $("[class]").css("color",
                             "green");
        });
    </script>
</head>

<body>
    <center>

        <!-- Class(demo) attribute-->

        <h3 class="demo">GeeksforGeeks</h3>
        <p>A computer science portal for geeks</p>

        <!--id attribute-->

        <p id>Geek1</p>
        <p>Geek2</p>

        <!--class(test) attribute-->

        <p class="test">Geek3</p>

        <!--class(sample) attribute-->

        <div class="sample"> Thank You! </div>

    </center>
</body>

</html>

Output:

In the above example, all the elements with the specified attribute (class) are formatted into green color rather considering the value of the attribute. "GeeksforGeeks", "Geek3" and "Thank You!" are formatted.

jQuery [attribute] Selector

vaishalichauhan3003

Improve

Article Tags :

JQuery

Similar Reads

jQuery * Selector

The jQuery * selector selects all the elements in the document, including HTML, body, and head. If the * selector is used together with another element then it selects all child elements within the element used. Syntax: $("*")Parameters: *: This parameter is used to select all elements.Example 1: Se

jQuery #id Selector

jQuery is an open-source JavaScript library that simplifies the interactions between an HTML/CSS document, or more precisely the Document Object Model (DOM), and JavaScript. Elaborating on the terms, it simplifies HTML document traversing and manipulation, browser event handling, DOM animations, Aja

jQuery .class Selector

The jQuery .class selector specifies the class for an element to be selected. It should not begin with a number. It gives styling to several HTML elements. Syntax: $(".class") Parameter: class: This parameter is required to specify the class of the elements to be selected.Example 1: In this example,

jQuery multiple classes Selector

The jQuery multiple class selector is used to select multiple classes of an HTML document. Syntax: $(".class1, .class2, .class3, ...")Parameter: class: This parameter is required to specify the class of the elements to be selected.Example 1: In this example, we will select the multiple classes by us

jQuery element Selector

jQuery is an open-source JavaScript library that simplifies the interactions between an HTML/CSS document, or more precisely the Document Object Model (DOM), and JavaScript. Elaborating the terms, it simplifies HTML document traversing and manipulation, browser event handling, DOM animations, Ajax i

jQuery multiple elements Selector

The jQuery multiple elements Selector is used to select multiple elements of an HTML document. Syntax: $("element1, element2, element3, ...")Parameter: element: This parameter is required to specify the elements to be selected.Example 1: In this example, we will select the multiple elements by using

jQuery :first Selector

The jQuery :first Selector is used to select the first element of the specified type. Syntax: $(":first")Example 1: In this example, we will select the first <p> element by using jQuery :first Selector. HTML <!DOCTYPE html> <html> <head> <script src= "https://ajax.goo

jQuery :last Selector

The jQuery :last Selector is used to select the last element of the specified type. Syntax: $(":last")Example 1: In this example, we will select the last <p> element by using jQuery :last Selector. HTML <!DOCTYPE html> <html> <head> <script src= "https://ajax.googleap

jQuery :even Selector

jQuery is an open-source JavaScript library that simplifies the interactions between an HTML/CSS document, or more precisely the Document Object Model (DOM), and JavaScript. Elaborating on the terms, it simplifies HTML document traversing and manipulation, browser event handling, DOM animations, Aja

jQuery :odd Selector

jQuery is an open-source JavaScript library that simplifies the interactions between an HTML/CSS document, or more precisely the Document Object Model (DOM), and JavaScript. Elaborating the terms, it simplifies HTML document traversing and manipulation, browser event handling, DOM animations, Ajax i