jquery Selector Summary

1 The JQuery selector is incredibly powerful, and here's a simple summary of common element lookup methods2  3$ ("#myELement"Select an element with an ID value equal to myelement, the ID value cannot be duplicated in the document only one ID value is myelement so the only element that gets is4$ ("div"Select all div tag elements to return an array of DIV elements5$ (". myClass"Select all elements of CSS that use the MyClass class6$ ("*") Selects all the elements in the document and can be selected in a variety of ways: for example $ ("#myELement, div,.myclass") 7  8 Cascade selector:9$ ("form input"Select all the input elements in the form elementTen$ ("#main > *"Select all child elements with the ID value of main one$ ("label + input"selects the next INPUT element node of all the label elements, and the test selector returns all input label elements that follow the label tag directly followed by the input label. a$ ("#prev ~ div"the sibling selector, which returns all the div tags that belong to the same parent element for the label element with ID prev -   - Basic Filter Selector: the$ ("tr:first") Select the first of all TR elements -$ ("tr:last") Select the last of all TR elements -$ ("input:not (: Checked) + span")    -   + filter Out: All input elements of the checked selector -   +$ ("tr:even") Select 0,2,4 for all TR elements... ... Element (note: The sequence number starts at 0 because the selected number of elements is an array.) a   at$ ("tr:odd") Select 1,3,5 for all TR elements... ... An element -$ ("td:eq (2)"Select the TD element with the ordinal 2 in all TD elements -$ ("TD:GT (4)"Select all TD elements in the TD element with an ordinal greater than 4 -$ ("td:lt (4)"Select all TD elements in the TD element with an ordinal less than 4 -$ (": header")  -$ ("div:animated")  in Content Filter Selector: -   to$ ("div:contains (' John ')"Select all the elements in the div that contain the John text +$ ("td:empty"Select all the arrays of TD elements that are empty (nor include text nodes) -$ ("div:has (p)"Select all DIV elements that contain the P tag the$ ("td:parent"Select all the array of elements with the TD as the parent node * Visual Filter Selector: $  Panax Notoginseng$ ("div:hidden"Select all of the hidden div elements -$ ("div:visible") Select all of the visual div elements the Attribute Filter Selector: +   a$ ("div[id")Select all DIV elements that contain the id attribute the$ ("input[name= ' Newsletter ')" selects all the name attributes equal to ' newsletter 'the INPUT element +   -$ ("input[name!= ' Newsletter ')" selects all name attributes not equal to ' newsletter 'the INPUT element $   $$ ("input[name^= ' News ')") Select all the name attributes with ' news 'the input element that begins with -$ ("input[name$= ' News ')") Select all the name attributes with ' news 'end of INPUT element -$ ("input[name*= ' man ')") Select all the name attributes that contain ' news 'the INPUT element the   -$ ("input[id][name$= ' Man ')"You can use multiple properties for federated selection, which is to get all the elements that have an id attribute and then the property ends with a manWuyi   the child element Filter Selector: -   wu$ ("ul li:nth-child (2)"), $ ("ul li:nth-child (odd)"), $ ("ul li:nth-child (3n + 1)")  -   about$ ("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 the child nodes of only one child node in all Div -   - form Element Selector: a   +$ (": input"Select all of the form input elements, including input, textarea, select, and button the   -$ (": text") Select all text input elements $$ (":p assword") Select all the password input elements the$ (": radio") Select all the radio input elements the$ (": checkbox") Select all the checkbox input elements the$ (": submit") Select all the submit input elements the$ (": image") Select all the image input elements -$ (": reset") Select all the reset input elements in$ (": button") Select all the button input elements the$ (": file") Select all the file input elements the$ (": hidden"selects all input elements of type hidden or hidden fields of the form about   the Form element Filter Selector: the   the$ (": enabled") Select all the operable table cells +$ (":d isabled") Select all of the non-operable table cells -$ (": checked") Select all of the table cells that are checked the$ ("select option:selected"selects all the elements of the selected in the child element of the SelectBayi   the    the   - Select the text value of the previous TD for the input text box named "s_03_22″" -$ ("input[@ name =s_03_22]. Parent (). prev (). text () the   the the name begins with "s_" and is not terminated with "_r" the$ ("input[@ name ^= ' s_ ']"). not ("[@ name $= ' _r '] ") the   - a value that is selected by a radio named Radio_01 the$ ("input[@ name =radio_01] [@checked] "). Val ();  the   the   94   the    the   the$ ("A B"finds all child nodes under the a element, including non-direct child nodes98$ ("a>b"find the immediate child nodes below the A element about$ ("a+b"find the sibling nodes that follow the a element, including the Non-direct child nodes -$ ("a~b"find the sibling nodes that follow the a element, not including the Non-direct child nodes101  1021. $ ("A B"finds all child nodes under the a element, including non-direct child nodes103  104 example: Find all input elements in the form the  106 HTML code:107  108<form>109<label>Name:</label> the<input name= "name"/>111<fieldset> the<label>Newsletter:</label>113<input name= "newsletter"/> the</fieldset> the</form> the<input name= "none"/>117 jQuery code:118  119$ ("form input")  - results:121  122[<input name= "name"/>, <input name= "newsletter"/> ] 123  1242. $ ("a>b"find the immediate child nodes below the A element the example: Match all the child input elements in the FORM. 126  127 HTML code: -  129<form> the<label>Name:</label>131<input name= "name"/> the<fieldset>133<label>Newsletter:</label>134<input name= "newsletter"/>135</fieldset>136</form>137<input name= "none"/>138 jQuery code:139   $$ ("form > input") 141 results:142  143[<input name= "name"/> ] 144  1453. $ ("a+b"find the sibling nodes that follow the a element, including the Non-direct child nodes146 example: Match all input elements following the label147  148 HTML code:149   max<form>151<label>Name:</label> the<input name= "name"/>153<fieldset>154<label>Newsletter:</label>155<input name= "newsletter"/>156</fieldset>157</form>158<input name= "none"/>159 jQuery code: the  161$ ("label + input") 162 results:163  164[<input name= "name"/>, <input name= "newsletter"/> ] 165  166  1674. $ ("a~b"find the sibling nodes that follow the a element, not including the Non-direct child nodes168 example: Find all input elements with form peers169   the HTML code:171  172<form>173<label>Name:</label>174<input name= "name"/>175<fieldset>176<label>Newsletter:</label>177<input name= "newsletter"/>178</fieldset>179</form> the<input name= "none"/>181 jQuery code:182  183$ ("form ~ input") 184 results:185  186[<input name= "none"/>]

jquery Selector Summary