过滤器和选择器是有区别的。过滤器的作用是在已经选择的元素中进行过滤操作。单独使用过滤器,相当于使用了“*”这个全选择器,性能会降低。所以在使用过滤器时,一定要在过滤器前添加选择器。
下面是所有的过滤器:
名称 |
说明 |
举例 |
:first |
匹配找到的第一个元素 |
$(“tr:first”)查找表格的第一行 |
:last |
匹配找到的最后一个元素 |
$(“tr:last”)查找表格的最后一行 |
:not(selector) |
去除所有与给定选择器匹配的元素 |
$(“input:not(:checked)”)查找所有未选中的input元素 |
:even |
匹配所有索引值为偶数的元素 索引从0开始计算 |
$(“tr:even”)表格的1.3.5行 |
:odd |
匹配所有索引值为奇数的元素 索引从0开始计算 |
$(“tr:odd”)表格的2.4.6行 |
:eq(index) |
匹配一个给定索引值的元素 |
$(“tr:eq(1)”)第二行 |
:gt(index) |
匹配所有大于给定索引值的元素 注:index从0开始计算 |
$(“tr:gt(0)”)查找第2.3。。。。 行 |
:lt(index) |
选择结果集中索引小于N的elements |
$(“tr:lt(2)”)查找第一行,第二行 |
:header |
选择所有H1,H2,H3一类的header标签 |
$(“:header”).css(“background”,”#eee”) 给所有页面标题加上背景色 |
:animated |
匹配所有正在执行动画效果的元素 |
$(“#run”).click(function){$(“div:not(:animated)”).animated({left: “+=20”},1000);} 只有对不再执行动画效果的元素执行一个动画特效 |
基本过滤器使用要点
此分类中的过滤器使用场景很少,只有not过滤器最常被使用。
div:not([title])相当于首先使用div[title]查找含有title的div,然后在$(div)找到所有的div中排除掉这些div。