AdBlock Detected

We provide high-quality source code for free. Please consider disabling your AdBlocker to support our work.

Buy me a Coffee

Saved Tutorials

No saved posts yet.

×
Press Enter to see all results
Home jQuery JQuery- Attribute Equals | [attribute=value] | Selector Example

JQuery- Attribute Equals | [attribute=value] | Selector Example

By pushpam abhishek • •
Listen to this article

jquery attribute equals selector example


jquery attribute equals selector:-

jquery attribute equals selector allows us to selects the element whose specified attribute value exactly equals a specific string value.

[attribute=value] 

jquery attribute equals selector example:-


In the following example, we will see how we will select all <input> type with the value of  “colorMe” and change the background color of selected <input> to “light green” using the jquery attribute equals selector.



<!DOCTYPE html>
<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script>
        $(document).ready(function(){
            $("input[value='colorMe']").css('background-color','lightgreen');
        });
    </script>
<body>
<input type="button" value="colorMe">
<input type="button" value="SimpleButton">
<input type="button" value="colorMe">
<input type="button" value="SimpleButton">
<input type="text" value="colorMe">
</body>
</html>


Output:-

jquery attribute equals selector



jquery attribute equals selector example explanation :-

$(“input[value='colorMe']“).css(‘background-color’,’lightgreen’); This line tells jquery to select all <input> type elements that has the value of “colorMe”. Once the selection process is done, this css(‘background-color’,’lightgreen’); function sets the background color to lightgreen to all selected items.


                        Share this article with your friends                         

Share this post

pushpam abhishek

About pushpam abhishek

Pushpam Abhishek is a Software & web developer and designer who specializes in back-end as well as front-end development. If you'd like to connect with him, follow him on Twitter as @pushpambhshk

You Might Also Like

Comments

← Newer Older →