jQuery选择器可分为基本选择器和过滤选择器
(二)过滤选择器
★简单过滤选择器:主要根据索引值对元素进行筛选。
1、:first选择器:对当前jQuery集合进行过滤并选择出第一个匹配元素
jQuery("selector:first");
注:参数selector为任何有效的选择器
2、:last选择器:对当前jQuery集合进行筛选并选择出最后一个匹配元素
jQuery("selector:last");
注:参数selector为任何有效的选择器
3、:odd选择器:选择索引为奇数(从0开始计数)的所有元素
jQuery("selector:odd");
4、:even选择器:选择索引为偶数(从0开始计数)的所有元素
jQuery("selector:even");
5、:eq()选择器:用于从匹配的集合中选择索引等于给定值的元素
jQuery("selector:eq(index)");
注:参数index指定元素在selector集合中的索引值(从0开始计数)
6、:gt()选择器:从匹配的集合中选择索引大于给定值的所有元素
jQuery("selector:gt(index)");
注:参数index指定元素在selector集合中的索引值(从0开始计数)
7、:lt()选择器:从匹配的集合中选择索引小于给定值的所有元素
jQuery("selector:lt(index)");
注:参数index是一个非负整数,用于指定元素在selector集合中的索引值(从0开始计数)
8、:not()选择器:从匹配的集合中除去与给定选择器匹配的元素
jQuery(selector1:not(selector2));
注:selector1和selector2均为任何有效的选择器,表示从selector1匹配的集合中移除与selector2匹配的所有元素
9、:header()选择器:选择所有诸如h1、h2、h3之类的标题元素
jQuery(":header")
10、:animated选择器:选择所有正在执行动画效果的元素
jQuery("selector:animated");
注:参数selector为任何有效的选择器
★内容过滤选择器
1、:contains()选择器:选择包含给定文本的所有元素
jQuery("selector:contains(text)");
注:参数selector是任何有效的选择器,text指定要查找的文本(引号是可选的),该文本可以直接出现在选定的元素或其任何后代元素中
2、:has()选择器:选择包含子元素的元素
jQuery("selector:has(selector2)");
3、:empty选择器:选择不包含子元素或文本的所有空元素
jQuery("selector:empty");
注:selector集合中不包含子元素或文本的所有空元素将包含在查询结果中
4、:parent选择器:选择包含子元素或文本的元素
jQuery("selector:parent");
注:selector集合中包含子元素或文本的所有空元素将包含在查询结果中
★属性过滤选择器
1、包含属性选择器:选择包含给定属性的所有元素
jQuery("selector[attribute]");
注:参数attribute表示属性名,value表示属性值,多数情况指定属性值时的引号是可选的
2、属性等于选择器:选择给定属性等于某特定值的所有元素
jQuery("selector[attribute=value]");
注:参数attribute表示属性名,value表示属性值
3、属性包含选择器:选择指定属性值包含给定子字符串的所有元素
jQuery("selector[attribute*=value]");
注:参数selector为任何有效的选择器,用于指定要查找的元素;attribute为属性名,value为属性值,引号是可选的。
4、属性包含单词选择器:选择指定属性值中包含给定单词(由空格分隔)的元素
jQuery("selector[attribute~ =value]");
5、属性不等于选择器:选择不包含指定属性,或者包含指定属性但该属性不等于某个值的所有元素
jQuery("selector[attribute!=value]");
6、属性开始选择器:选择给定属性是以某特定值开始的所有元素
jQuery("selector[attribute^ =value]");
7、属性结束选择器:选择指定属性是以某特定值结束的所有元素
jQuery("selector[attribute$=value]");
8、复合属性选择器:选择同时满足多个条件的所有元素
jQuery("selector[selector1][selector2][selectorN]");
★子元素过滤选择器
1、:first-child选择器:选择是其父级的第一个子元素的所有元素
jQuery("selector:first-child");
2、:last-child选择器:选择是其父级的最后一个子元素的所有元素
jQuery("selector:last-child");
3、:nth-child()选择器:选择父元素下的第N个子元素或奇偶元素
jQuery("selector:nth-child(index/even/odd/equation)");
4、:only-child选择器:选择某元素的唯一子元素
jQuery("selector:only-child");
★表单域属性过滤选择器
1、:check选择器:选择所有被选中的表单域
2、:disabled选择器:选择所有被禁用的的表单域
3、:enable选择器:选择所有可用的表单域
4、:selected选择器:从列表框中选择所有选中的option元素
jQuery("selector option:selected");
★可见性过滤选择器
1、:hidden选择器:选择所有的不可见元素
2、:visible选择器:选择所有的可见元素
共同学习,写下你的评论
评论加载中...
作者其他优质文章