jQuery选择器

jQuery选择器的分类：

基本选择器

#id

根据指定的id匹配元素
单个元素

$(“#hel”)选择id=hel的元素

.class

根据类匹配元素
集合元素

$(“.hel”)选择class=hel的元素

Element

根据元素名匹配元素
集合元素

$(“div”)选择所有的div元素

*

匹配所有元素
集合元素

$(“*”)选择所有元素

符号选择器

E1,E2,E3

分组匹配元素
集合元素

$(“div,span,.hotclass”)选择所有div，span,和class为hotcalss的元素

$(“E1 E2”)

选择E1下所有E2
集合元素

$(“div span”)选择div下所有span

$(“E1> E2”)

选择E1下的子E2,不包含E2下满足的元素
集合元素

$(“div > span”)选择div下的span元素，不包含span下的span元素

$(“E1+ E2”)

选择E1后紧相邻的E2
集合元素

$(“.one + div”)选择class=one的下一个div元素

$(“E1~ E2”)

选择E1之后的所有E2
集合元素

$(“#one ~ div”)选择id为one后的所有div元素

属性选择器

[attribute]

选择拥有此属性的元素
集合元素

$(“div[id]”)选择拥有id属性的div元素

[attribute=value]

选择属性值为value的元素
集合元素

$(“div[id=test]”)选择id属性值为test的div元素

[attribute!=value]

选择属性值不为value的元素
集合元素

$(“div[id!=test]”)选择id属性值不为test的div元素,没有id属性的div也会被选择

[attribute^=value]

选择属性值以value开始的元素
集合元素

$(“div[id^=test]”)选择id属性值以test开始的所有div元素

[attribute$=value]

选择属性以value值结束的元素
集合元素

$(“div[id$=test]”)选择id属性值以test结束的所有div元素

[attribute*=value]

选择属性中含有value的元素
集合元素

$(“div[id*=test]”)选择id属性值中含有test的所有div元素

[attribute~=value]

选择多个属性属性中含有value元素
集合元素

$("[class~='div11']")选择class属性值中含有test的所有div元素

过滤选择器

过滤选择器主要是通过特定的过滤规则来筛选出需要的DOM元素，过滤规则与CSS中的伪类选择器语法相同，即过滤选择器都是以冒号(:)开头。

子元素过滤选择器

:first-child

选择每个父元素的第1个子元素
集合元素

:first只选择单个元素,而:first-child将为每个父元素匹配第1个子元素如:
$(“ul li:first-child”)选择每个ul下的第一个<li>

:last-child

选取每个父元素的最后1个子元素
集合元素

$(“ul li:last-child”)选择每个ul下的最后一个<li>

:nth-child

选取每个父元素下的第index个子元素或奇偶元素.(index从1开始）
集合元素

:eq(index)只匹配一个元素,而:nth-child(index)将为每一个父元素匹配子元素,
并且:nth-child(index)的index从1开始,而:eq(index)的index从0开始.

:nth-last-child

选取每个父元素下的倒数第index个子元素或奇偶元素.(index从1开始）
集合元素

:eq(index)只匹配一个元素,而:nth-child(index)将为每一个父元素匹配子元素,
并且:nth-child(index)的index从1开始,而:eq(index)的index从0开始.

:only-child

如果某个元素是它父元素中惟一的子元素,那么将会被匹配.如果父元素中含有其他元素,则不会被匹配
集合元素

$(“ul li:only-child”)在<ul>中选取是惟一子元素的<li>

以下几种是只考虑当前种类标签
:first-of-type
:last-of-type
:nth-of-type
:nth-last-of-type
:only-of-type

基本过滤选择器

:first

选择第1个元素
单个元素

$(“div:first”)选择第1个div元素

######:last
选择最后1个元素
单个元素

$(“div:last”)选择最后1个div元素

:eq(index)

选择索引值是index的元素，index从0开始
单个元素

$(“tr:eq(1)”)选择表格行索引等于1的行

:gt(index)

选择索引值大于index的元素,index从0开始
集合元素

$(“tr:gt(1) ”)选择表格行索引大于1的行

:lt(index)

选择索引值小于index的元素,index从0开始
集合元素

$(“tr:lt(1)”)选择表格行索引小于1的行

:even

选择索引是偶数的所有元素，索引从0开始
集合元素

$(“tr:even”)选择表格中所有偶数的行

:odd

选择索引是奇数的所有元素，索引从0开始
集合元素

$(“tr:odd”)选择表格中所有奇数的行