分类解析jQuery选择器(jquery层次选择器主要包括哪几种分类)

推荐整理分享分类解析jQuery选择器(jquery层次选择器主要包括哪几种分类)，希望有所帮助，仅作参考，欢迎阅读内容。

文章相关热门搜索词:jquery层次选择器主要包括哪几种分类,jquery选择类,jquery怎样用类来选定一个html元素,jquery选择类,jquery分组,jquery选择器分类,jquery分组,jquery分组选择器,内容如对您有帮助，希望把文章链接给更多的朋友！

基本选择器：

　　#id　　　　　　　　　　　　根据Id匹配一个元素

　　.class　　　　　　　　　　 根据给定的类名匹配一个元素

　　element　　　　　　　　　 根据元素名匹配一个元素

　　*　　　　　　　　　　　　　匹配所有元素

　　selecttor1,selector2　　　 并集，返回两个选择器匹配到的元素

层次选择器：

　　ancestor descendant　　　根据祖先匹配所有的后代元素

　　parent>child　　　　　　　 根据父元素匹配所有的子元素，直接后代

　　prev+next　　　　　　　　 匹配下一个兄弟元素 相当于next()方法

　　prev~siblings　　　　　　 匹配后面的兄弟元素 相当于nextAll()方法 siblings()方法为匹配所有的兄弟元素

简单过滤选择器：

　　:first或first()　　　　　　　 匹配第一个元素

　　:last或last()　　　　　　 　匹配最后一个元素

　　:not(selector)　　　　　　 匹配非selector能匹配到的元素

　　:even　　　　　　　　　　 匹配索引值为偶数的元素，索引号从0开始

　　:odd　　　　　　　　 　　　匹配索引值为奇数的元素，索引号从0开始

　　:eq(index)　　　　　 　　　匹配指定索引号的元素，索引号从0开始

　　:gt(index)　　　　　 　　　匹配索引号大于给定索引值的元素，索引号从0开始

　　:lt(index)　　　　　　 　　 匹配索引号小于给定索引值的元素，索引号从0开始

　　:header　　　　　　　　　　匹配所有的标题元素 h1 h2 h3 h4 h5 h6

　　:animated　　　　　　　　 匹配所有正在执行动画的元素

内容过滤选择器：

　　:contains(text)　　　　　　匹配包含给定文本的元素

　　:empty　　　　　　　　　　匹配所有不包含子元素或者文本的空元素

　　:has(selector)　　　　　　 匹配后代中含有selector能匹配上元素的元素

　　:parent　　　　　　　　　　匹配含有子元素或者文本的元素

可见性过滤选择器：

　　:hidden　　　　　　　　　　匹配不可见元素，或者type="hidden"的元素　含有css样式:display:"none";的元素，无论CSS是内联，导入，链接式

　　:visible　　　　　　　　　　 获取所有的可见元素

属性过滤选择器：

　　[attribute]　　　　　　　　 匹配含有给定属性的元素

　　[attribute=value]　　　　 匹配含有属性=value的元素

　　[attribute!=value]　　　　 匹配含有属性但!=value的元素

　　[attribute^=value]　　　　 匹配属性值是以value开始的元素

　　[attribute$=value]　　　　 匹配属性值是以value结束的元素

　　[attribute*=value]　　　　 匹配属性值包含某些值的元素，部分前后，中间有也算

　　[selector][selector]　　　　 匹配属性选择器的交集

子元素过滤选择器：

　　:nth-child(eq|even|odd|index)　　获取所有父元素特定位置的子元素

　　:first　　　　　　　　　　　 获取所有父元素下的第一个子元素

　　:last　　　　　　　　　　　 获取所有父元素下最后一个子元素

　　:only-child　　　　　　　　 获取所有父元素下唯一的一个元素

表单对象属性过滤选择器：

　　:enabled　　　　　　　　 获取表单中所有可用的元素

　　:disabled　　　　　　　　　 获取表单中所有不可用的元素

　　:checked　　　　　　　　　获取表单张所有被选中的元素

　　:selected　　　　　　　　 获取表单中所有被选中的option的元素

表单选择器：

　　:input　　　　　　　　　　 获取所有的表单元素<input开头的，还有textarea select

　　:text　　　　　　　　　　 获取所有的单行文本框　　<input type="text" />

　　:password　　　　　　　　获取所有的密码框元素 <input type="password" />

　　:radio　　　　　　　　　　 获取所有的单选按钮　　　<input type="radio" />

　　:checkbox　　　　　　　　 获取所有的复选框　　　　<input type="checkbox">

　　:submit　　　　　　　　　 获取所有的提交按钮　　　<input type="submit" />

　　:image　　　　　　　　　　获取所有的图像按钮　　 <input type="image" />

　　:reset　　　　　　　　　　获取所有的重置按钮　　　 <input type="reset" />

　　:button　　　　　　　　 获取所有的按钮　　　　　<input type="button">

　　:file　　　　　　　　　　　 获取所有的文件上传框　　<input type="file" />

1、基本选择器

　　(1)、#id 根据Id匹配一个元素

　　(2)、element 根据给定的元素名匹配元素

　　(3)、class 根据class属性匹配元素

　　(4)、* 匹配所有的元素

　　　　$("*").css("background-color","red");

　　(5)、selector1,selector2　　选择器之间用逗号分隔　　返回每一个选择器匹配到的元素

　　　　$(".div1,#span1").css("background-color","red");

2、层次选择器

　(1)、ancestor descendant 根据祖先元素匹配所有的后代元素，返回的是匹配到的后代元素，用空格分开。

(2)、parent > child　　根据父元素匹配所有的子元素　　返回所有的子元素　　用大于号">"分隔

(3)、prev + next　　匹配紧接在prev元素后的相邻的下一个元素 用加号"+"分隔。

　　　　相当于.next()方法

(4)、prev ~ sibings　　　　匹配prev后面的的所有兄弟元素 用波浪线"~"分隔开

　　　　相当于 nextAll()方法

　(5)、选中所有的兄弟元素 siblings() 方法

3、简单过滤选择器

　　(1)、first()或:first　　　　选中符合条件的第一个元素

(2)、last()或:last　　　　符合条件的最后一个元素

　(3)、:not(selector)　　　　符合条件但不能被selector选中的元素

　(4)、:even　　　　　　获取指定索引值为偶数的元素(0、2、4、6、8……)，注意索引号是从0开始的

　(5)、odd　　　　　　　　获取指定索引值为奇数的元素(1、3、5、7、9......)，注意索引号是从1开始的

(6)、eq(index)　　　　　　选取指定索引值的元素，索引值从0开始

　(7)、gt(index)　　　　　　获取所有索引值大于index的元素，索引号从0开始

　(8)、lt(index)　　　　　　获取所有索引值小于index的元素，索引号从0开始

(9)、:header　　　　　　　索取所有标题类型元素h1、h2、h3、h4、h5、h6

()、animated　　　　正在执行动画效果的元素

4、内容过滤选择器

　　(1)、:contains(text) 获取包含给定文本的元素

　　(2)、:empty　　获取不包含子元素或文本的空元素

　(3)、:has(selector)　　　选中含有selector所匹配元素的元素,(注意不限于直接子元素，只要是后代含有都算)

(4)、:parent　　含有子元素或者文本元素的元素

5、可见性过滤选择器

　　(1)、:hidden　　选中所有不可见元素

(2)、:visible　　选中所有可见元素

6、属性过滤选择器

　　(1)、[attribute]　　获取包含给定属性的元素

　　(2)、[attribute=value]　　获取属性值等于value的元素

　　(3)、[attribute!=value]　　获取属性值不等于value的元素

　　 (4)、[attribute^=value]　　获取属性值以value开始的元素

　　(5)、[attribute$=value]　　获取属性值以value结束的元素

　　(6)、[attribute*=value]　　获取属性值包含value值元素

　　(7)、[selector][selector][selector]　　获取属性交集元素

7、子元素过滤选择器

　　　(1):nth-child(eq|even|odd|index)　　　　获取每个父元素下的特定位置元素，索引号从1开始

(2):first-child　　　　选中每个父元素下的第一个

(3)、:last-child　　选中每一个父元素下的最后一个元素

(4)、:only-child　　获取每个父元素下唯一仅有的一个子元素

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

　　(1)、:enabled　　获取表单中所有属性为可用的元素

(2)、:disabled　　获取表单中属性不可用的元素

(3)、:checked　　　　获取表单中被选中的元素　　从属性能够知道用户选中了哪个

(4)、:selected　　　　获取表单中被选中的元素　　此属性能够知道用户选择了哪个

9、表单选择器

(1)、:input　　获取所有的input、textarea、select

(2)、:text　　获取所有的单行文本框，也就是<input type="text" />元素

(3)、:password　　获取所有的密码框　　也就是<input type="password" />元素

(4)、:radio　　获取所有的单选按钮

(5)、：checkbox　　获取所有的复选框

(6)、:submit　　　　获取所有的提交按钮

(7)、:image　　　　获取所有的图像域

(8)、:reset　　　　获取所有重置按钮

(9)、:button　　　　获取所有的按钮

()、:file　　　　获取所有的文件域