jquery-Picker Sorting

First, the basic selector

1) ID Selector

2) Tag Selector

3) class Selector

4) Wildcard Selector

Second, level selector

1) including selector

2) sub-selector

3) adjacent selector

4) Brother selector

Third, simple pseudo-class selector

1) Specific position selector

2) Specify range selector

3) exclude selectors

Iv. Content-related pseudo-class selectors

1) match includes text selector

2) match includes element selector

3) match includes inference selector

4) Parsing content filtering implementation principle

V. Pseudo-Class selectors related to element display states

Vi. pseudo-class selectors that match child elements

Vii. pseudo-class selectors related to form objects

-------------------------------------------------------------------------------------------

First, the basic selector 1, the ID selector. Syntax: JQuery ("#id")

<script src= "Jquery/jquery-1.6.4.js" type= "Text/javascript" ></script><script type= "Text/javascript "> $ (function () {   $ (" #div1 "). CSS (" Background "," Red ");}) </script><title> on-Machine practice </title>


2. Tag Selector, syntax: JQuery ("element") Note: no additional prefixes (#) required
<script src= "Jquery/jquery-1.6.4.js" type= "Text/javascript" ></script><script type= "Text/javascript "> $ (function () {   $ (" div "). CSS (" Color "," red ");}) </script><title> Untitled Documents </title>


3. Class selector, Syntax: JQuery (". ClassName") ClassName is a string that represents the class attribute value of the label, the prefix symbol "." Indicates that the selector is a class selector. The return value is a jquery object that includes a matching classname element.
<script src= "Jquery/jquery-1.6.4.js" type= "Text/javascript" ></script><script type= "Text/javascript "> $ (function () {   $ (". Red "). CSS (" Color "," red ");}) </script><title> Untitled document </title>
4. Wildcard selector, Syntax: JQuery ("*") The parameter "*" is a string that will match all the label elements in the specified range.
<script src= "Jquery/jquery-1.6.4.js" type= "Text/javascript" ></script><script type= "Text/javascript "> $ (function () {   $ (" Body * "). CSS (" Color "," red ");}) </script><title> Untitled Document </title>


Second, the level selector 1, including selectors. Syntax: in JQuery ("ancestor descendant"), ancestor means including selectors, descendant means including selectors.
jquery can filter out all including elements that match the ancestor selector in the elements that match the ancestor selector. eg
<script src= "Jquery/jquery-1.6.4.js" type= "Text/javascript" ></script><script type= "Text/javascript "> $ (function () {  $ (" form input "). CSS ({" Border ":" Solid 1px red "," background ":" Blue "}) </script><title> Untitled Documents </title>

2, sub-selector. Syntax: In JQuery ("Parent>child"), the parent represents the parental selector. The child represents the sub-selectors that are included, and ">" is the identifier for the child selector. jquery can be in an element that matches the parent selector. Filters out all child elements that match the children selector. eg
<script src= "Jquery/jquery-1.6.4.js" type= "Text/javascript" ></script><script type= "Text/javascript "> $ (function () {  $ (" div > img "). CSS (" border "," solid 5px Red ");}) </script><title> Untitled document </title>

3, adjacent selectors, syntax: JQuery ("Prev+next"), Prev represents the adjacent previous selector. Next represents the adjacent last selector, and "+" is the identifier of the adjacent selector.
jquery can filter out all adjacent sibling elements that match the next selector after the prev selector matches the element.
eg
<script src= "Jquery/jquery-1.6.4.js" type= "Text/javascript" ></script><script type= "Text/javascript "> $ (function () {  $ (" div + img "). CSS (" border "," solid 5px Red ");}) </script><title> Untitled document </title>

4, Brother selector, Syntax: JQuery ("Pre ~ siblings"), Prev represents the adjacent previous selector. The siblings represents the adjacent sibling selector, and "~" is the identifier for the sibling selector.
jquery can filter out all sibling elements that match the siblings selector after the elements that match the prev selector.
eg
<script src= "Jquery/jquery-1.6.4.js" type= "Text/javascript" ></script><script type= "Text/javascript "> $ (function () {  $ (" div ~ img "). CSS (" border "," solid 5px Red ");}) </script><title> Untitled document </title>

5. Comprehensive application of hierarchical selector
Simple pseudo-class selectors simple pseudo-class selectors are also known as positioning filters, because they filter elements at specific locations primarily by number and rank. or filter out specific elements 1, the specific location selector mainly includes: First,: Last and: QE (index) 3. : First you can select the 1th element in the matching collection, instead: Last you can select the final element in the matching collection, and: EQ (index) determines the element at the specified position based on the index value. Detailed users such as the following: jquery ("Selector:first") jquery ("Selector:last") jquery ("Selector:eq (Index)"), index starting from 0 counts eg:
<script src= "Jquery/jquery-1.6.4.js" type= "Text/javascript" ></script><script type= "Text/javascript "> $ (function () {  $ (" Tr:first "). CSS ({" Background ":" Blue "," Color ":" White "});  $ ("TR:QE (1)"). CSS ("Background", "#F1F5FB");  $ ("Tr:last"). CSS ("Background", "#ff9"); }) </script><title> Untitled document </title>
</td></tr> <tr><td>:last</td><td> matches the last element found.
</td></tr></table></body>

2, the designated range selector mainly includes: even,: Odd,: GT (Index) and: LT (index) Four kinds: Even select all even line elements in the matching collection: Select all the odd row elements in the odd match collection: GT (Index) Select an element in the matching collection that is greater than the given index value: the LT (index) match collection selects an element that is less than the given index value eg:
<script src= "Jquery/jquery-1.6.4.js" type= "Text/javascript" ></script><script type= "Text/javascript  "> $ (Function () {$ (" Tr:even "). CSS (" Background "," #F1F5FB ");  $ ("tr:odd"). CSS ("Background", "#ff9"); $ ("Tr:first"). CSS ({"Background": "Blue", "Color": "White"}); }) </script><title> Untitled document </title>
</td></tr> <tr><td>:last</td><td> matches the last element found. </td></tr> <tr><td>:first</td><td> matches the 1th element found. </td></tr> <tr><td>:last</td><td> matches the last element found.
</td></tr> <tr><td>:first</td><td> matches the 1th element found. </td></tr> <tr><td>:last</td><td> matches the last element found. </td></tr></table></body>

3. Exclude selector Syntax: JQuery ("Selector1:not (Selector2)"), Selector1, Selector2, and not as strings. Of Selector1 and Selector2 represent the discretionary form of the selector, ":" As the identifier of the pseudo-class selector, and not to exclude the function identifier. eg
<script src= "Jquery/jquery-1.6.4.js" type= "Text/javascript" ></script><script type= "Text/javascript  "> $ (Function () {$ (" Tr:even "). CSS (" Background "," #F1F5FB ");  $ ("tr:odd"). CSS ("Background", "#ff9");  $ ("Tr:first"). CSS ({"Background": "Blue", "Color": "White"}); $ ("Tr:not (TR:LT (3))"). CSS ({"Background": "White", "Color": "Black"}); }) </script><title> Untitled document </title>
</td></tr></table></body>

Iv. Content-related pseudo-class selectors: contains-〉 matches elements that include the given text. Like what. $ ("Div:contains (' picture ')") matches all DIV elements that include "picture": Empty-〉 matches all null elements that do not include child elements or text. : Has-〉 matches the element that contains the element that the selector matches.
Like what.
$ ("Div:has (P)") matches all DIV elements that include the P element
1. Match includes text selector syntax: JQuery ("Selector:contains (text)")
<script src= "Jquery/jquery-1.6.4.js" type= "Text/javascript" ></script><script type= "Text/javascript "> $ (  function () {    $ (" dd:contains (' Jobs ') "). CSS (" text-decoration "," underline ");  }) </script><title> Untitled document </title>
1955-2011 always remember in our hearts! Steve Jobs, go all the way!
</dd>  <dt> Ah, the FA launch point </dt>  <dd> the </dd></dl></body of a three of the hair >

2. Match includes element selector syntax: jquery ("Selector1:has (Selector2)"), 3, match includes inference selector syntax: jquery ("Selector:empty"); JQuery ("Selector:parent");: empty content element in the match element: element 4 in the parent match element including non-empty content, parsing the content filtering implementation principle
V. Pseudo-Class selectors related to the display state of an element: Hidden matches all invisible elements, or elements of type hidden: visible matches all of the visual elements
VI. Pseudo-class selector matching child elements: Nth-child matches the nth child or odd-even element under its parent element: First-child matches the first child element. : First matches only one element, whereas: The First-child selector matches one child element for each parent element: Last-child matches the last child element. : Last matches only one element, whereas: The Last-child selector will match one child element for each parent: Only-child assumes that an element is the only child element in the parent element that will be matched; Assuming that the parent element contains other elements, it will not be matched
Vii. pseudo-class selectors related to form objects: input matches all input, textarea,select, and button elements: text matches so the single-line text box: Password matches all password boxes: Radio matches all radio boxes: checkbox matches All check boxes: Submit match all submissions Button:image match all image fields: Reset match all reset Button:button match all buttons: file matches All files: Hidden matches all invisible elements
 
jquery-Picker Sorting