jQuery 有哪些过滤器? 下面本篇文章给大家简单介绍一下 jQuery 过滤选择器. 有一定的参考价值, 有需要的朋友可以参考一下, 希望对大家有所帮助.
jQuery 过滤器 -- 过滤选择器
过滤? 肯定是要添加过滤条件的. 通过 ":" 添加过滤条件, 比如 "$("div:first")" 返回 div 元素集合的第一个 div 元素, first 是过滤条件.
按照不同的过滤规则, 过滤选择器可以分为基本过滤, 内容过滤, 可见性过滤, 属性过滤, 子元素过滤和表单对象属性过滤选择器.
1, 基本过滤选择器
a) ":first", 选取第一个元素, 别忘记它也是被放在一个集合里哦! 因为 jQuery 它是 DOM 对象的一个集合. 如,"$("tr:first")" 返回所有 tr 元素的第一个 tr 元素, 它仍然被保存在集合中.
b) ":last", 选取最后一个元素. 如,"$("tr:last")" 返回所有 tr 元素的最后一个 tr 元素, 它仍然被保存在集合中.
c) ":not(selector)", 去除所有与给定选择器匹配的元素. 如,"$("input:not(:checked)")" 返回所有 input 元素, 但去除被选中的元素(单选框, 多选框).
d) ":even", 选取所有元素中偶数的元素. 因为 jQuery 对象是一个集合, 这里的偶数指的就是集合的索引, 索引从 0 开始.
e) ":odd", 选取所有元素中奇数的元素, 索引从 0 开始.
f) ":eq(index)", 选取指定索引的元素, 索引从 0 开始.
g) ":gt(index)", 选取索引大于指定 index 的元素, 索引从 0 开始.
h) ":lt(index)", 选取索引小于指定 index 的元素, 索引从 0 开始.
i) ":header", 选取所有的标题元素, 如 hq,h2 等.
j) ":animated", 选取当前正在执行的所有动画元素.
2, 内容过滤选择器
它是对元素和文本内容的操作.
a) ":contains(text)", 选取包含 text 文本内容的元素.
b) ":empty", 选取不包含子元素或者文本节点的空元素.
c) ":has(selector)", 选取含有选择器所匹配的元素的元素.
d) ":parent", 选取含有子元素或文本节点的元素.(它是一个父节点)
3, 可见性过滤选择器
根据元素的可见与不可见状态来选取元素.
":hidden", 选取所有不可见元素.
":visible", 选择所有可见元素.
可见选择器: hidden 不仅包含样式属性 display 为 none 的元素, 也包含文本隐藏域 (<input type="hidden">)和 visible:hidden 之类的元素.
4, 属性过滤选择器
通过元素的属性来选取相应的元素.
a) "[attribute]", 选取拥有此属性的元素.
b) "[attribute=value]", 选取指定属性值为 value 的所有元素.
c) "[attribute !=value]", 选取属性值不为 value 的所有元素.
d) "[attribute ^= value]", 选取属性值以 value 开始的所有元素.
e) "[attribute $= value]", 选取属性值以 value 结束的所有元素.
f) "[attribute *= value]", 选取属性值包含 value 的所有元素.
g) "[selector1] [selector2]...[selectorN]", 复合性选择器, 首先经 [selector1] 选择返回集合 A, 集合 A 再经过 [selector2] 选择返回集合 B, 集合 B 再经过 [selectorN] 选择返回结果集合.
5, 子元素过滤选择器
一看名字便是, 它是对某一元素的子元素进行选取的.
a) ":nth-child(index/even/odd)", 选取索引为 index 的元素, 索引为偶数的元素, 索引为奇数的元素.
l nth-child(even/odd): 能选取每个父元素下的索引值为偶 (奇) 数的元素.
l nth-child(2): 能选取每个父元素下的索引值为 2 的元素.
l nth-child(3n): 能选取每个父元素下的索引值是 3 的倍数的元素.
l nth-child(3n + 1): 能选取每个父元素下的索引值是 3n + 1 的元素.
b) ":first-child", 选取第一个子元素.
c) ":last-child", 选取最后一个子元素.
d) ":only-child", 选取唯一子元素, 它的父元素只有它这一个子元素.
6, 表单过滤选择器
选取表单元素的过滤选择器.
a) ":input", 选取所有 < input>,<textarea>,<select > 和 < button > 元素.
b) ":text", 选取所有的文本框元素.
c) ":password", 选取所有的密码框元素.
d) ":radio", 选取所有的单选框元素.
e) ":checkbox", 选取所有的多选框元素.
f) ":submit", 选取所有的提交按钮元素.
g) ":image", 选取所有的图像按钮元素.
h) ":reset", 选取所有重置按钮元素.
i) ":button", 选取所有按钮元素.
j) ":file", 选取所有文件上传域元素.
k) ":hidden", 选取所有不可见元素.
7, 表单对象属性过滤选择器
选取表单元素属性的过滤选择器.
":enabled", 选取所有可用元素.
":disabled", 选取所有不可用元素.
":checked", 选取所有被选中的元素, 如单选框, 复选框.
":selected", 选取所有被选中项元素, 如下拉列表框, 列表框.
更多 web 前端 https://www.html.cn/ 知识, 请查阅 HTML 中文网 !!
来源: http://www.css88.com/qa/jquery/17485.html