jquery选择器

1.基本选择器

　　　基本选择器是jquery中经常使用的，也是最简单的。它经过元素id、class和标签名等来查找DOM元素。在网页中，每一个id名称只能使用一次，class容许使用屡次。

　　　#id：根据给定的id匹配一个元素 例如：$('#test') 选取id为test的元素。

　　　.class：根据给定的类名匹配元素 例如:$('.test') 选取全部class为test的元素。

　　　element：根据给定的元素名匹配元素  例如：$('p') 选取全部的<p>元素。

　　　*：匹配全部的元素 例如：$('*') 选取全部的元素

 　　 selector1,selector2,...：将每个选择器匹配到的元素凑合并后一块儿返回 例如：$('div,span,p.myClass')选取全部的<div>,<span>,和拥有class为myClass的                                                                                                               <p>标签的一组元素。

 

2.层次选择器

　　　若是想经过DOM之间的层次关系来获取特定元素，例如后代元素、子元素、相邻元素和兄弟元素等，那么层次选择器是一个很是好的选择。

　　　$("ancstor descendant") 选取ancstor 元素里的全部descendant（后代）元素 例如：$("div span") 选取<div>里的全部<span>元素。

　　　$("parent>child") 选取parent元素下面的child（子）元素，与$("ancstor descendant")有区别 例如：$("div>span") 选取<div>元素下元素名为<span>的                                                                                                                                             子元素。

　　　$('prev+next') 选取紧接在prev元素后的next元素 例如：$('.one+div')选取class为one的下一个<div>元素。

　　　$('prev~siblings') 选取prev元素以后的全部siblings元素 例如：$('#two~div') 选取id为two的元素后面的全部<div>兄弟元素。

 

3.过滤选择器

　　　过滤选择器主要是经过特定的过滤规则来筛选出所需的DOM元素，过滤规则与CSS中的伪类选择器语法相同，即选择器以一个冒号开头。按照不一样的过滤规则，过滤选择器能够分为基本过滤、内容过滤、可见性过滤、属性过滤、子元素过滤和表单对象属性过滤选择器。

　　　1）基本过滤选择器

　　　:first  选取第一个元素 例如：$("div:first") 选取全部<div>元素中第一个<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(1)")选取索引等于1的<input>元素

　　　:gt(index)  选取索引大于index的元素（index从0开始） 例如：$("input:gt(1)")选取索引大于1的<input>元素

　　　:lt(index)  选取索引小于index的元素（index从0开始） 例如：$("input:lt(1)")选取索引小于1的<input>元素

　　　:header  选取全部的标题元素，例如h1，h2，h3等等 例如：$(":header") 获取网页中全部的<h1>,<h2>，<h3>...

　　　:aniimated 选取当前正在执行动画的全部元素 例如：$("div:animated") 选取正在执行动画的<div>元素

 

　　　2）内容过滤选择器

　　　内容过滤选择器的过滤规则主要体如今它所包含的子元素或文本内容上。

　　　:contains(text)  选取含有文本"test"的元素 例如：$("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="visibility:hidden">等元素。若是只想选取<input>元素，可以使用$("input:hidden")

　　　:visible  选取全部可见的元素 例如：$("div:visible")选取全部可见的<div>元素

 

　　　4）属性过滤选择器

　　　属性过滤选择器的过滤规则是经过元素的属性来获取相应的元素。

　　　[attribute]  选取拥有此属性的元素 例如：$("div[id]")选取拥有属性id的元素

　　　[attribute=value]  选取属性值为value的元素 例如：$("div[title=test]")选取属性title为"test"的<div>元素

　　　[attribute!=value]  选取属性值不等于value的元素 例如：$("div[title!=test]")选取属性title不等于"test"的<div>元素（注意：没有属性title的<div>元素也会被选取）

　　　[attribute^=value]  选取属性值以value开始的元素 例如：$("div[title^=test]")选取属性title以"test"开始的<div>元素

　　　[attribute$=value]  选取属性值以value结束的元素 例如：$("div[title$=test]")选取属性title以"test"结束的<div>元素

　　　[attribute*=value]  选取属性值含有value的元素 例如：$("div[title*=test]")选取属性title含有"test"的<div>元素

　　　[selector1][selector2][selectorN]  用属性选择器合并成一个复合属性选择器，知足多个条件。每选择一次，缩小范围一次

                                                        例如：$("div[id][title$='test']")选取拥有属性id，而且属性title以"test"结束的<div>标签

 

　　　5）子元素过滤选择器

　　　子元素过滤选择器的过滤规则相对于其余的选择器稍微有些复杂，不过不要紧，只要将元素的父元素和子元素区分清楚，使用起来也很是简单。另外还要注意它与普通的过滤选择器的区别。

　　　:nth-child(index/even/odd/eauation)  选取每一个父元素下的第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  选取每一个父元素的最后一个子元素 例如：:last只返回单个元素，而:last-child选择符将为每一个父元素匹配最后一个子元素。

                                                                 $("ul last-child") 选取每一个<ul> 中最后一个<li>元素

　　　:only-child  若是某个元素是它父元素中惟一的子元素，那么将会被匹配。若是父元素中含有其余元素，则不会被匹配  例如：$("ul li:only-child")在<ul>中选取                                                                                                                                                             是惟一子元素的<li>元素

　　　:nth-child()选择器是很经常使用的子元素过滤选择器：

　　　:nth-child(even)能选取每一个父元素下的索引是偶数的元素。

　　　:nth-child(odd)能选取每一个父元素下的索引是奇数的元素。

　　　:nth-child(2)能选取每一个父元素下的索引值等于2的元素。

　　　:nth-child(3n)能选取每一个父元素下的索引值是3的倍数的元素，n从0开始。

　　　:nth-child(3n+1)能选取每一个父元素下的索引值是(3n+1)的元素，n从0开始。

 

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

　　　此选择器主要是对所选择的表单元素进行过滤，例如选择被选中的下拉框，多选框等等。

　　　:enabled  选取全部可用的元素 例如：$("#form1 :enabled")选取id为"form"的表单内的全部可用元素

　　　:disabled  选取全部不可用的元素 例如：$("#form1 :disabled  ")选取id为"form"的表单内的全部不可用元素  

　　　:checked  选取全部被选中的元素(单选框，复选框) 例如：$("input:checked")选取全部被选中的<input>元素

　　　:selected  选取全部被选中的选项元素（下拉列表） 例如：$("select :selected")选取全部被选中的选项元素

 

4.表单选择器

　　　为了使用户可以更加灵活地操纵表单，jQuery中专门加入了表单选择器。利用这个选择器，能极其方便地获取到表单的某个或某类型的元素。

　　　:input 选取全部的<input>、<textarea>、<select>和<button>元素 例如:$("":input)选取全部的<input>、<textarea>、<select>和<button>元素

　　　:text  选取全部的单行文本框 例如：$(":text")选取全部的单行文本框

　　　:password 选取全部的密码框 例如：$(":password")选取全部的密码框

　　　:radio  选取全部的单选框 例如：$(":radio")选取全部的单选框

　　　:submit  选取全部的提交按钮 例如：$(":submit")选取全部的提交按钮

　　　:image  选取全部的图像按钮 例如：$(":image")选取全部的图像按钮

　　　:reset  选取全部的重置按钮 例如：$(":reset")选取全部的重置按钮

　　　:button  选取全部的按钮 例如：$(":button")选取全部的按钮

　　　:file  选取全部的上传域 例如：$(":file") 选取全部的上传域

　　　:hidden  选取全部不可见元素 例如：$(":hidden")选取全部不可见元素