jQuery content filter selector usage analysis_jquery

The example in this article describes the usage of jQuery content filter selector. Share it with everyone for your reference. The specific analysis is as follows:

In an HTML document, the content of an element can be text or sub-elements. If a certain selector or content filtering selector is used together, you can further filter out elements with a given

from the queried elements.

Text or sub-element elements

1. :contains() selector

is used to select all elements containing the given text, format:

Copy code The code is as follows:

$( "selector1:contains(text)")

For example:

Copy code The code is as follows:

$("p:contains('text')") .css("background", "#FCF");

2. :has() selector

is used to filter elements containing a given sub-element, format:

Copy code The code is as follows:

$(" selector1:has(selector2)")

selector1 and selector2 are any valid elements

For example:

Copy code The code is as follows:

$("li:has(p)").css ("background", "red");

3. :empty() selector

Format:

Copy code The code is as follows:

$("selector:empty")

is used Select all elements that do not contain child elements or text. All empty elements in the selector that do not contain child elements or text will be included in the query results

For example:

Copy code The code is as follows:

$("td:empty").css("background ", "#FCF");

4. :parent selector

Format:

Copy code The code is as follows:

$("selector:parent")

is used Selects elements containing child elements or text, which is the opposite of the empty selector

For example:

Copy code The code is as follows:

$("td:parent").css("background ", "#FCF");

I hope this article will be helpful to everyone’s jQuery programming.