1. Basic Selector
| Selector Selector |
Describe |
Return |
Example |
| #id |
|
single Element |
$ ("#test") |
| . class |
|
Collection elements |
$ (". Test") |
| Element |
|
Collection elements |
$ ("P") |
| * |
Match all elements |
Collection elements |
$("*") |
| Selector1,selector2 |
|
Collection elements |
$ ("div,span,p") |
2. Hierarchy Selector
| Selector Selector |
Describe |
Return |
Example |
| $ ("ancestor descendant") |
Select All Descendants |
Collection elements |
$ ("div span") |
| $ ("Parent>child") |
Select Direct descendants |
Collection elements |
$ ("Div.span") |
| $ ("Prev+next") |
Select the next element immediately after the Prev element |
Single element |
$ (". One+div") |
| $ ("prev~siblings") |
Select the siblings element immediately after the Prev element |
Collection elements |
$ (". One~div") |
3. Filter Selector
(1) Basic filter Selector
| Selector Selector |
Describe |
Return |
Example |
| : First |
|
single Element |
$ ("Div:first") |
| : Last |
|
single Element |
$ ("Div:last") |
| : Not (selector) |
|
Collection elements |
$ ("Input:not (. MyClass)") |
| : Even |
Index starting from 0 |
Collection elements |
$ ("Input:even") |
: Odd
|
|
Collection elements |
$ ("input:odd") |
| : EQ (Index) |
|
Single element |
$ ("Input:eq (1)") |
| : GT (Index) |
|
Collection elements |
$ ("INPUT:GT (1)") |
| : LT (Index) |
|
Collection elements |
$ ("Input:lt (1)") |
| : Header |
Select all of the caption elements |
Collection elements |
$ (": Header") |
| : Animated |
Select the element that is currently performing the animation |
Collection elements |
$ (": animated") |
| : Focus |
Select the element that currently takes focus |
Single element |
$ (": Focus") |
(2) Content Filter Selector
| Selector Selector |
Describe |
Return |
Example |
| $ (": Contains (text)") |
|
Collection elements |
$ ("Div:contains (' I ')") |
| $ (": Empty") |
Select empty elements that do not contain child elements or text |
Collection elements |
$ ("Div:empty") |
| $ (": Has (selector)") |
|
Collection elements |
$ ("Div:has (P)") |
| $ (":p arent") |
Select an element that contains child elements or text |
Collection elements |
$ ("div:parent") |
(3) Visibility Filter Selector
| Selector Selector |
Describe |
Return |
Example |
| : Hidden |
Select all Invisible elements |
Collection elements |
$ (": Hidden") |
| : Visible |
Select all visible elements |
Collection elements |
$ ("div:visible") |
(4) Attribute filter Selector
| < strong> selector |
description |
return |
example |
| [attribute] |
Select the element that owns this property |
set elements |
$ ("Div[id]") |
| [Attribute=value] |
Select the element with the value of the property as |
Collection elements |
$ ("div[title=test]") |