jQuery [attribute!=value] Selector

Quiz

The [attribute!=value] selector in jQuery is used to select elements that do not have a specific attribute value. In other words, It filters elements based on attributes that do not match a specified value.

Syntax

Following is the syntax of [attribute!=value] Selector in jQuery −

$("[attribute!='value']")

Parameters

Here is the description of the above syntax −

attribute: The attribute of the HTML element that you are checking.
value: The value that the attribute should not be equal to.

Example 1

In the following example, we are using the jQuery [attribute!=value] Selector to select the elements where the 'data-type' attribute is not 'fruit' −

<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script>
        $(document).ready(function(){
            $("div[data-type!='fruit']").css("background-color", "yellow");
        });
    </script>
</head>
<body>
    <div data-type="fruit">Apple</div>
    <div data-type="vegetable">Carrot</div>
    <div data-type="fruit">Banana</div>
    <div data-type="vegetable">Broccoli</div>
</body>
</html>

The selected elements will be highlighted with yellow background color.

Example 2

Here, we are disabling the buttons except those with type='submit −

<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script>
        $(document).ready(function(){
            // Disable all buttons except those with type='submit'
            $("button[type!='submit']").prop("disabled", true);
        });
    </script>
</head>
<body>
    <button type="button">Click Me</button>
    <button type="reset">Reset</button>
    <button type="submit">Submit</button>
</body>
</html>

After executing the above program, the selected button will be disabled.

jquery_ref_selectors.htm

Print Page