Jquery选择器

jquery选择器分为基本选择器、层次选择、过滤选择器和表单选择器。

一、基本选择器

选择器	描述	示例
#id	根据给定的id匹配一个元素	$('#test')选取id为test的元素
.class	根据给定的类名匹配元素	$(".text")选取所有class为。text的元素
element	根据给定的元素名匹配元素	$("p")匹配所有的<p>元素
*	匹配所有元素	$("*")选取所有元素
selector1,selector2,....,selectorN	将每一个选择器匹配到的元素合并后一起返回	$("div,span,p.myClass")选取所有拥有<div>,<span>和class为myClass的<p>标签的一组元素

二、层次选择器

选择器	描述	示例
$("ancestor decendant")	选取ancestor元素里的所有decendan（后代）元素	$("div span")选取div里的span元素
$("parent>child")	选取parent下的child子元素与$("ancestor decendant")有区别，它选择的是后代元素	$("div>span")选取<div>元素下名为<span>的子元素
$("prev+next")	选取紧接prev元素后的next元素	$(".one + div")选取class为one的下一个div同辈元素（等价方法$(".one").netx("div")）
$("prev ~ siblings")	选取元素之后的所有siblings元素	$("#two ~ div")选取id为two的元素后面的多有div同辈元素（等价方法$("#two").nextAll("div")）

三、过滤选择器

1、基本过滤选择器

选择器	描述	示例
:first	选取第1个元素	$("div:first")选取所有div元素中第1个div元素
:last	选取最后一个元素	$("div:last")选取所有div中最后一个div元素
:not(selector)	去除所有给定选择器匹配的元素	$("input:not(.myClass)")选取class不是myClass的input元素
:even	选取索引是偶数的所有元素，索引从0开始	$("input:even")选取索引是偶数的input元素
:odd	选取索引是奇数的所有元素，索引从0开始	$("input:odd")选取索引是奇数的input元素
:eq(index)	选取索引等于index的元素（index从0开始）	$("input:eq(0)")选取索引等于0的input元素
:gt(index)	选取索引大于index的元素（index从0开始）	$("input:gt(0)")选取索引大于0的input元素
:lt(index)	选取索引小于index的元素（index从0开始）	$("input:lt(0)")选取索引小于0的input元素
:header	选取所有的标题元素（h1,h2..）	$("div:header")选取div元素中的所有h1,h2...元素
:animated	选取当前正在执行的动画元素	$("div:animated")选取正在执行动画的div元素
:focus	选取当前获得焦点的元素	$(":focus")选取档期获取焦点的元素

2、内容过滤选择器

选择器	描述	示例
:contains(text)	选取含有文本内容为‘text’的元素	$("div:contains('我')")选取含有文本‘我’的div元素
:empty	选取不包含子元素或者文本为空的元素	$("div:empty")选取不包含子元素或者文本为空的div元素
:has(selector)	选取含有选取则所匹配的元素的元素	$("div:has('p')")选取含有元素p的div元素
:parent	选取含有子元素或者文本的元素	$("div:parent")选取含有子元素的div元素

3、可见性过滤选择器

选择器	描述	示例
:hidden	选取所有不可见的元素	$(":hidden")选取不可见的元素,包括<input type='hidden'>,<div style='display:none'>,<div style='visbility:hidden'>等元素
:visible	选取所有可见的元素	$("div:visible")选取所有可见的div元素

4、属性过滤选择器

选择器	描述	示例
[attribute]	选取拥有此属性的元素	$("div[id]")选取拥有属性id的div元素
[attribute=value]	选取属性值为value的元素	$("div[title=test]")选取属性title为“test”的div元素
[attribute!=value]	选取属性值不等于value 的元素	$("div[title!=test]")选取属性title不为“test”的元素
[attribute^=value]	选取属性值以value开始的元素	$("div[title^=test]")选取属性值以test开始的div元素
[attribute$=value]	选取属性值以value结束的元素	$("div[title$=test]")选取属性值以test结束的div元素
[attribute*=value]	选取属性值包含value的元素	$(div[title*=test])选取属性值包含test的div元素
[attribute|=value]	选取属性值等于给定的字符串或者以该字符串为前缀（该字符串后跟一个连字符‘-’）的元素	$("div[title|="en"]")选取属性title等于en或者以en为前缀（该字符串后跟一个连字符‘-’）的元素
[attribute~=value]	选取属性用空格分隔的值中包含一个给定值的元素	$("div[title~"uk"]")选取属性title用空格分隔的值中包含字符uk的元素
[attribute1][attribute2][attribute3]	用属性选择器合并成一个复合属性选择器，满足多个条件，每选择一次缩小一次范围	$("div[id][title$='test']")选取拥有属性id并且属性title以“test”结束的div元素

5、子元素过滤选择器

选择器	描述	示例
:nth-child(index/even/odd/equation)	选取每个元素下的地index个子元素或者奇偶元素（index从1算起）	:eq(index)只匹配一个元素，而:nth-child将为每一个父元素匹配子元素，并且:nth-child(index)的index是从1开始的，而eq(index)是从0开始的
:first-child	选取每个父元素的第一个子元素	:first只返回单个元素，而first-child选择符将每个父元素匹配第一个子元素。$("ul li:first-child")选取每个ul中第一个li元素
:last-child	选取每个元素的最后一个元素	为每个父元素匹配最后一个子元素。$("ul li:last-child")选取每个ul中的最后一个li
:only-child	如果某个元素师它父元素中唯一的子元素，那么将会被匹配。若果父元素中含有其他元素，则不匹配	$("ul li:onley-child")在ul中选取是唯一子元素的li元素

6、表单对象属性过滤选择器

选择器	描述	示例
:enabled	选取所有可用元素	$("#form1 :enabled")选取id为“”form1“的表单内的所有可用元素
:disabled	选取所有不可用元素	$("#form1 :disabled")选取id为“”form1“的表单内的所有不可用元素
:checked	选取所有被选中的元素（单选框，复选框）	$("input:checked")选取所有被选中的input 元素
:selected	选取多有被选中的选项元素（下拉列表）	$("select option:selected")选取多有被选中的选项元素

四、表单选择器

选择器	描述	示例
:input	选取多有的<input><textarea><select><button>元素	略
:text	选取多有的单行文本框	$(":text")选取多有的单行文本框
:password	选取多有的密码框	同上类似
:radio	选取多有的单选框	。。。
:checkbox	选取所有的多选框	。。。
:submit	选取多有的提交按钮	。。。
:image	选取所有的图像按钮	。。。
:reset	选取多有的重置按钮	。。。
:button	选取多有的按钮	。。。
:file	选取多有的上传域	。。。
:hidden	选取多有不可见元素	。。。