Home > Web Front-end > Front-end Q&A > jquery attribute filter does not contain

jquery attribute filter does not contain

PHPz
Release: 2023-05-18 17:55:38
Original
1060 people have browsed it

When learning and using jQuery, attribute selectors are a very important type of selector. Attribute selectors can filter elements based on their attribute values. Common ones include equal to, not equal to, contains, and does not contain.

However, among attribute filters, the exclude filter does not seem to be as commonly used as other attribute filters. The exclude filter is a relatively complex filter that requires us to enter a specific selector to filter. In this article, we will explore the exclude filter in jQuery and its usage.

1. The syntax of a filter that does not contain attributes

The syntax of a filter that does not include attributes is similar to the syntax of other attribute filters, but a colon: is required within square brackets. Its general form is as follows:

$('selector:not([attribute!=value])');

This selector uses the not() method , which wraps the filter and excludes all elements that satisfy the selector. We can use one or more properties, values, and operators inside square brackets.

If we don't want elements to match a specific attribute value, we can use an exclusive filter. Use an exclamation mark! within square brackets, followed by an equal sign =. Within the quotes after the equal sign, we can write attribute values ​​that we do not want to match.

2. The use of non-containing attribute filters

In order to better understand the non-containing attribute filter, let us look at some specific examples.

We have the following HTML code:

    <div class="example" data-value="9"></div>
    <div class="example" data-value="10"></div>
    <div class="example" data-value="12"></div>
Copy after login

Now, we want to select only those elements whose data-value attribute does not contain "5" among these elements. We can use the following code to achieve this:

$('.example:not([data-value="5"])');

This will give We return three elements with data-value attributes of 9, 10 and 12. This is because 5 is the attribute value we don't want, and the not() method inverts the matched result and returns the element we want.

Next, we can extend this selector with other attributes and operators. For example, we can use the < operator to select elements with a data-value attribute less than ten:

$('.example:not([data-value<"10"])');

This will select elements with data-value attributes of 9 and 5, but not 10 and 12.

3. Summary

The non-containing attribute filter is a very useful selector, which can help us quickly write code to filter the elements we want. Although it's a bit complicated, as long as you understand the basic syntax and usage, you can harness its power to make your code more concise and easier to read.

Before writing any jQuery selectors, make sure you fully understand the syntax and usage, and test your code to make sure it works correctly. Thank you for reading this article, we hope it will be helpful when writing jQuery code.

The above is the detailed content of jquery attribute filter does not contain. For more information, please follow other related articles on the PHP Chinese website!

source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template