Shulou(Shulou.com)06/03 Report--

This article mainly introduces how Jquery filter selector, has a certain reference value, interested friends can refer to, I hope you read this article after a great harvest, the following let Xiaobian with you to understand.

1. Match elements according to a certain filtering rule, starting with a ":" sign when written, usually used to find a single element at a certain position in the set elements.

$("li:first") first

$("li:last") Last

2. If you want to select any tag element from an array of tag elements, you can use:eq(index)

The parameter index represents the index number (i.e., an integer), which starts at 0.

If index has a value of 3, the fourth element is selected: $("li:eq(3)")

3. To find one or more elements by text content, it's easier to use the:contains(text) selector,

Its function is to select all elements containing the specified string, and it is usually used in combination with other elements to obtain all element objects containing the contents of the "text" string.

where the parameter text represents text in the page.$ ("li:contains('jQuery')")

Powerful "jQuery" "javascript" is also useful "jQuery" front-end must learn Java is a development language. Front-end weapon--"jQuery"

4.: has(selector) The function of a filter selector is to get all elements in the selector that contain the specified element name,

where the selector parameter is the name of the included element and is the included element.

$("li:has ('p ')") selector code to get the

All elements of the element

5.: The function of hidden filter selector is to get all invisible elements, including those with type attribute value hidden.

$("p:hidden") code gets hidden

elements

6.: visible filter selector gets all visible elements, that is, as long as the element's display attribute value is not set to "none,"

Then, all can be obtained through this selector.$ ("p:visible") selector code, get that visible

elements

7. Attributes, as an important feature of DOM elements, can also be used in selectors. The selector that obtains elements through element attributes

[attribute=value] The function of the attribute selector is to get all elements exactly the same as the attribute name and attribute value, where [] is a parenthesis dedicated to the attribute selector, the parameter attribute represents the attribute name, and the value parameter represents the attribute value.

$("li[title ='my favourites ']") Attribute selector code to get the specified element

8. [attribute!= value] The function of the attribute selector is to obtain all elements that do not contain attribute names or are different from attribute names and attribute values.

where [] is a parenthesis character dedicated to attribute selectors, the attribute parameter represents the attribute name, and the value parameter represents the attribute value.

$("li[title!= 'My Favorites']") Attribute selector code, get the specified element, which does not contain the title attribute name, the title attribute value is not equal to" My Favourites "

9. More powerful attribute selector [attribute*=value], which can get all elements with specified content in attribute value,

Where [] is a parenthesis character dedicated to attribute selectors, the attribute parameter represents the attribute name, and the value parameter represents the corresponding attribute value.

$("li[title*='most ']") attribute selector code to get the specified elements whose title attribute values contain the "most" character

10. Using the:first-child filter selector, you can get the first child returned from each parent element, which is a collection and often uses multiple collection data selection processes.

celery eggplant radish Chinese cabbage tomatoes orange banana grape Apple watermelon $("li:first-child").css("background-color", "green");

11.: The function of last-child filter selector is to get the last child element returned from each parent element. It is also a collection, and it is often used to select multiple collection data.

$("li:last-child").css("background-color", "blue");

Thank you for reading this article carefully. I hope that the article "How to implement filter selector in Jquery" shared by Xiaobian will be helpful to everyone. At the same time, I hope that everyone will support it a lot and pay attention to the industry information channel. More relevant knowledge is waiting for you to learn!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.