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]") |