In DOM programming, we can only use finite functions to get DOM objects based on IDs or tagname. However, in jquery it's quite different, and jquery provides an unusually powerful selector to help us get the objects on the page and return the objects in the form of a jQuery wrapper set. This paper mainly introduces and classifies the common jquery selectors.
The JQuery selector can be broadly grouped into 4 categories: The basic selector, the hierarchy selector, the filter selector, and the form selector.
The filter selector can be divided into: Simple filter selector, Content filter selector, visibility filter selector, attribute filter selector, child element filter selector, Form object attribute filter selector.
Base selector:
$ ("#myELement") select an element with an ID value equal to MyElement, and the ID value cannot be repeated in the document only one ID value is myelement so the unique element is obtained
$ ("div") selects all div tag elements, returns an array of DIV elements
$ (". MyClass") Select all elements of a CSS that uses the MyClass class
$ ("*") Select all elements in the document [/code]
Joint selection can be made using a variety of options: for example $ ("#myELement, Div,.myclass")
Cascade selector:
$ ("Form input") select the INPUT element in all form elements
$ ("#main > *") Select all child elements of the ID value of main
$ ("label + input") Select the next INPUT element node for all label elements
The test selector returns all input label elements directly following the label label with an input label
$ ("#prev ~ div") Sibling selector
All of the div tags for the same parent element returned by the selector as a LABEL element with ID prev
Basic Filter Selector:
$ ("Tr:first") Selects the first
$ ("Tr:last") for all TR elements Select the last
$ ("Input:not (: Checked) + span")
of all TR elements to filter out: all input elements of the checked selector
$ ("tr: Even ") Select all TR elements of the first 0,2,4 ... ... Element (Note: Since the selected element is an array, the ordinal number is starting at 0)
$ ("tr:odd") Select the 1,3,5 of all TR elements ... Element
$ ("Td:eq (2)") Select the TD element with serial number 2 in all TD elements
$ ("TD:GT (4)") Select all TD elements in the TD element with an ordinal greater than 4
$ ("Td:ll (4)") Select all TD elements with a number less than 4 in the TD element
$ (": Header")
$ ("div:animated")
Content Filter Selector:
$ ("Div:contains (' John ')") Select elements in all div that contain John text
$ ("Td:empty") selects all arrays of TD elements that are empty (and not including text nodes)
$ ("Div:has (P)") Select all DIV elements that contain p tags
$ ("td:parent") Select all array of elements with TD as parent node
Visual Filter Selector:
$ ("Div:hidden") Select all the hidden div elements
$ ("div:visible") Select all the visual div elements
Attribute Filter Selector:
$ ("Div[id]") Select all DIV elements that contain ID attributes
$ ("input[name= ' newsletter ']") selects all input elements that have the Name property equal to ' newsletter '
$ ("input[name!= ' newsletter ']") selects all input elements that are not equal to ' newsletter ' for all name properties
$ ("input[name^= ' News") selects all the input elements with the name attribute beginning with ' News '
$ ("input[name$= ' News '") Select all the input elements with the name attribute ending with ' news '
$ ("input[name*= ' Man ']") Select all the name attributes containing the ' news ' INPUT element
$ ("input[id][name$= ' man ')" can use multiple properties for joint selection, which is to get all the elements that contain the id attribute and then the attribute ends with a man
child element Filter Selector:
$ ("UL Li:nth-child (2)"), $ ("ul Li:nth-child (Odd)"), $ ("ul Li:nth-child (3n + 1)")
$ ("div span:first-child") returns an array of the first child nodes of all DIV elements
$ ("div span:last-child") returns an array of the last nodes of all DIV elements
$ ("div button:only-child") returns an array of all child nodes in all div with only one child node
Form element selector:
$ (": Input") Select all form input elements, including input, textarea, select and button
$ (": Text") Select all text input elements
$ (":p assword") Select all password input elements
$ (": Radio") Select all radio input elements
$ (": CheckBox") Select all checkbox input elements
$ (": Submit") Select all submit input elements
$ (": Image") Select all image input elements
$ (": Reset") Select all reset input elements
$ (": Button") Select All button input elements
$ (": File") Select all file input elements
$ (": Hidden") Select the hidden fields of all input elements or forms that are of type hidden
Form element Filter Selector:
$ (": Enabled") Select all operable form elements
$ (":d isabled") Select all of the form elements that are not operable
$ (": Checked") Select all of the checked form elements
$ ("Select Option:selected") Select the element to be selected in the child elements of all Select