JQuert选择器

在应用JQuery中，最常用的就是选择器的使用。

今天就系统的介绍一下JQuery的选择器

首先

JQuery选择器大致可以分为基本选择器、过滤选择器

基本选择器

CSS选择器

层级选择器

表单域选择器

1.1 CSS选择器

标签选择器：用于选择HTML页面已有的标签元素，也称元素选择器  格式： $("element");

ID选择器：用于获取某个具有ID属性的元素  格式： $("id")

类选择器 ：获取某个具有class属性的元素   格式：$("class")

通用选择器：通用选择器（*）匹配，多用于结合搜索  格式：$("*")

群组选择器：又称多元素选择器用于选择所有指定的组合的结果    格式：$("selector,selector2,......,selectorN")

1.2 层级选择器

子元素选择器：用于在给定的父元素下查找其下面的所有子元素   格式：$("parent>child")

后代选择器：用于在给定的祖先元素下匹配所有的后代元素  格式：$("ancestor descendant")

紧邻同辈选择器：用于匹配所有紧接在某元素后的第一个元素。 格式：$("prev+next")

相邻同辈选择器：用于匹配某元素后面的所有同辈元素。  格式：$("prev~slblings")

1.3 表单域选择器

:input选择器：用于选择所有input,textareaselect,button元素。 格式：$(":input")

:text选择器：用于选择所有单行文本框(<input type="text"/>)。格式：$(":text")

:password选择器：用于选择所有密码框(<input type="password"/>)。　格式：$(":password")

:radio选择器：用于选择所有单选按钮(<input type="radio"/>)    格式：$(":radio")

:chckbox选择器：用于选择所有复选框(<input type="chckbox"/>)   格式：$(":chckbox")

:file选择器：用于选择所有文件域(<input type="file"/>  格式：$(":file")

:image选择器：用于选择所有图像域(<input type="image"/>)   格式：$(":image")

:hidden选择器：　用于选择所有不可见元素(<input type="hidden"/>)。格式：$(":hidden")

:button选择器：用于选择所有按钮(<input type="button"/>和<button>···</button>) 　格式：$(":button")

:submit选择器：用于选择所有提交按钮(<input type="submit"/>和<button>···</button>)。格式：$(":submit")

:reset选择器：用于选择所有重置按钮(<input type="reset"/>)。格式：$(":reset")

过滤选择器

1、简单过滤选择器

2、内容过滤选择器

3、属性过滤选择器

4、子元素过滤选择器

5、表单域属性过滤选择器

6、可见性过滤选择器

2.1 简单过滤选择器

:first选择器：对当前jQuery集合进行过滤并选择出第一个匹配元素。　格式：$(":selector:first")

:last选择器：对当前jQuery集合进行过滤并选择出最后一个匹配元素。格式：$(":selector:last")

:odd选择器：用于选择索引为奇数（从0开始计数）的所有元素。　格式：$(":selector:odd")

:even选择器：用于选择索引为偶数（从0开始计数）的所有元素。　格式：$(":selector:even")

:eq()选择器：　用于从匹配的集合中选择索引等于给定值的元素。　格式：$(":selector:eq(index)),index 为指定元素在selector集合中的索引值（从0开始计数）

:gt()选择器：用于从匹配的集合中选择索引大于给定值的所有元素。格式：$(":selector:gt(index)),index 为指定元素在selector集合中的索引值（从0开始计数），只有索引值大于此值的元素才会包含在查询结果中。

:lt()选择器：用于从匹配的集合中选择索引小于给定值的所有元素。　格式：$(":selector:lt(index)),index 为指定元素在selector集合中的索引值（从0开始计数），只有索引值小于此值的元素才会包含在查询结果中。

:not选择器：　用于从匹配的集合中去除与给定选择器匹配的元素  　格式：$(":selector1:not(selector2)),其中selector1,selector2为任意有效的选择器,使用:not()选择器时， 将selector1匹配的集合中去掉 selector2匹配的所有元素。

:header选择：　用于选择所有诸如h1,h2,h3之类的标题元素。　格式：$(":header")

:animated选择器：　用于选择所有正在执行动画效果的元素。　格式：$("selector:animated")

2.2内容过滤选择器

:contains()选择器：　用于选择包含给定文本的所有元素。　格式：$("selector:contains(text)")

: has()选择器：　用于选择包含给定子元素的元素。格式：$("selector1:has(selector2)"),selector1，selector2为任意有效的选择器。

:empty选择器：用于选择不包含子元素或者文本的所有空元素。格式：$("selector:empty）

:parent选择器 ：用于选择包含子元素或者文本的所有空元素，与：empty选择器作用相反。格式：$("selector:parent(")

2.3属性过滤选择器

包含属性选择器：用于选择包含给定属性的所有元素。　格式：$("selector[attribute]")

属性等于选择器：用于选择给定属性等于某特定值的的所有元素  格式：$("selector[attribute=value]")

属性包含选择器： 用于选择给定属性值包含给定子字符串的所有元素。 　格式：$("selector[attribute*=value]")

属性包含单词选择器： 用于选择指定属性中包含给定单词（由空格分隔）的元素。 格式：$("selector[attribute~=value]")

属性不等于选择器：用于选择不包含给定属性，或者包含指定属性但该属性不等于某个值的所有元素。　格式：$("selector[attribute!=value]")

属性开始选择器：　用于选择包含给定属性是以某特定值开始的所有元素。格式：$("selector[attribute^=value]")

属性结尾选择器：　用于选择包含给定属性是以某个给定值结尾的所有元素。格式：$("selector[attribute$=value]")

复合属性选择器：用于选择同时满足多个条件的所有元素。格式：$("selector[selector1][selector2]....[selectorN]")

2.4子元素过滤选择器

:first-child选择器：用于选择其父级的第一个子元素的所有元素。格式：$("selector:first-child")

:last-child选择器  用于选择其父级的最后一个子元素的所有元素。 格式：$("selector:last-child")

:nth-child选择器：用于选择其父级的第N个子元素或奇偶的所有元素。　格式：$("selector:nth-child(index/even/odd/equation)")

:only-child选择器：　用于选择某元素的唯一选择。　格式：$("selector:only-child")

2.5表单域属性过滤选择器

:checked选择器 　用于选择所有被选中的表单域。　格式：$("selector:checked")

:enabled选择器： 用于选择所有可用的表单域。　格式：$("selector:enabled")

:disabled选择器： 用于选择所有被禁用的表单域。格式：$("selector:disabled")

:selected选择器：用于选择从列表框选择所有选中的option元素。　格式：$("selector:selected")

2.6可见性过滤选择器

:hidden选择器： 用于选择所有的不可见元素。　格式：$("selector:hidden") 　selector为任意有效选择器。

:visible选择器： 用于选择所有的可见元素。格式：$("selector:visible")  selector为任意有效选择器。

总结：自己在网上收拾整理 ，希望对大家有所帮助