jQuery有四大类选择器::基本选择器、层次选择器、过滤选择器、表单选择器.
其中,过滤选择器可以分为六种:简单过滤选择器、内容过滤选择器、可见性过滤选择器、属性过滤选择器、子元素过滤选择器、表单对象属性过滤选择器。
①、基本选择器
- ID选择器:$('#id');
- 元素选择器:$('div');
- 类选择器 : $('.class');
- 任意匹配选择器 : $('*') ;
- 用逗号隔开的独立选择器组合,选择列表总的所有对象 :$('#id,.class,div,...');
②、层次选择器
层次选择器通过DOM元素间的层次关系选择元素,主要的层次关系有:后代、父子、兄弟、相邻关系
$('ancestor descendant' ).....祖先与后代的关系,选择祖先ancestor的所有后代;
$('parent>child')...父子关系,选择父元素parent的所有子元素,不包括除子元素外的其他后代元素;
$('prev+next')...相邻关系,匹配所有紧跟在prev元素后的相邻元素,可以用.next()替代;
$('prev~siblings')...匹配prev后的所有兄弟元素,可以用.nextAll()替代;
.siblings()选择全部的相邻元素
③、过滤选择器
简单过滤选择器:10
.first()或:first 选择第一个元素
.last()或:last 选择最后一个元素
:not(selector) 选择除了指定选择器selector的所有元素
:even 获取所有索引为偶数的元素,index从0开始
:odd 获取所有索引为奇数的元素,index从0开始
:eq(index) 选择给定索引index的元素
:gt(index) 获取索引值大于index的元素
:lt(index) 获取索引值小雨index的元素
:header 获取所有标题类型元素,例如h1/h2/h3/h4/h5/h6/h7
:animated 获取正在执行动画效果的元素
内容过滤选择器:4
内容过滤选择器根据元素内容中的文字或者所包含的子元素的特征获取元素,其内容可以模糊或者绝对匹配进行元素定位
:contains('text'); 获取包含文本text的元素
:empty 选取所有不包含子元素或者文本的空元素
:has(selector) 选取含有选择器selector选择的元素的元素
:parent 获取含有子元素或者文本的元素
可见性过滤选择器:2
根据元素的是否可见的特征来选择元素
:hidden 获取所有不可见的元素或者type为hidden的元素和样式为visibility:hidden的元素
:visible 获取所有可见的元素
属性过滤选择器:7
根据元素的某个属性来选择器元素 ,如ID号或者匹配属性值的内容,并以”["号开头,以”]“号结尾
[attribute] 获取包含给定属性的元素
[attribute=value] 获取等于给定的属性是某个特定的值的元素
[attribute!=value] 获取不等于给定的属性是某个特定值的元素
[attribute^=value] 获取给定的属性是以给定的值开始的元素
[attribute$=value] 获取给定的属性是以给定的值结尾的元素
[attribute*=value] 获取给定的属性包含某些值的元素
[select1][select2][select3]...获取满足多个条件的复合属性的元素
子元素过滤选择器:4
:nth-child(eq|even|odd|index) 获取每个父元素下的特定位置的元素 索引号从1开始
:first-child 获取父元素下的第一个子元素
:last-child 获取父元素下的最后一个元素
:only-child 获取每个父元素下仅有一个子元素
表单对象属性过滤选择器:4
通过表单对象的某个特定属性来获取元素,如enabled,disabled,checked,selected属性
:enabled 获取表单中所有属性为可用的元素
:disabled 获取表单中所有属性为不可用的元素
:checked 获取表单中所有被选择的元素
:selected 获取表单中所有被选中的option元素
④、表单选择器
:input 获取所有input textarea select
:text 获取所有单行文本框
:password 获取所有密码框
:radio 获取所有的单选按钮
:checkbox 获取所有的复选框
:submit 获取所有提交按钮
:image 获取所有图像域
:reset 获取所有重置按钮
:button 获取所有按钮
:file 获取所有文件域
jQuery选择器总结
最新推荐文章于 2024-08-12 12:57:58 发布