jquery的过滤选择器做什么？常用过滤选择器有哪些？本篇文章就给大家介绍jquery的过滤选择器，让大家了解常用的jquery的过滤选择器有哪些。有一定的参考价值，有需要的朋友可以参考一下，希望对你们有所助。
首先我们了解一下jquery过滤选择器选择器的相关知识：
jquery 选择器可以对 HTML 元素组或单个元素进行操作。而，过滤选择器是jquery 选择器中应用最为广泛的一种，它可以根据某一类过滤规则进行元素匹配，查找到（一个或多个）元素，书写时以：开头。
jquery过滤选择器可以分为以下几大类：
jquery基本过滤选择器（重点）
jquery内容过滤选择器
jquery可见性过滤选择器
jquery属性过滤选择器
jquery状态过滤选择器
jquery子元素过滤选择器
下面我们就以上述的分类来聊聊常见的jquery过滤选择器有哪些，以及这些jquery过滤选择器的使用方法。
jquery基本过滤选择器（重点）
①first()或者：first 选取第一个元素
//选择第一个div元素$('div:first') $('div').first()
登录后复制
②last()或者：last 选取最后一个元素
//选择最后一个div元素$('div:last') $('div').last()
登录后复制
③：not(selector) 选取除开给定选择器的其他元素
$('div:not(.one)') //选择class不为one的 所有div元素
登录后复制
④：even 选取索引为偶数的元素，索引从0开始
$('div:even') //选择 索引值为偶数 的div元素
登录后复制
⑤：odd 选取索引为奇数的元素，索引从0开始
$('div:odd') //选择 索引值为奇数 的div元素
登录后复制
⑥：eq(index) 选取制定索引元素，从0开始
$('div:eq(3)') //选择 索引等于 3 的div元素
登录后复制
⑦：gt(index) 选取大于给定索引的元素，从0开始
$('div:gt(3)') //选择 索引大于 3 的div元素
登录后复制
⑧：lt(index) 选取小于给定索引的元素，从0开始
$('div:lt(3)') //选择 索引小于 3 的div元素
登录后复制
⑨：header 选取标题类型元素
$(':header') //选择 所有的标题元素.比如h1, h2, h3等等...
登录后复制
⑩：animated 选取正在执行动画效果的元素
$(':animated') //选择 当前正在执行动画的所有元素
登录后复制
⑪：focus 选取当前被焦点的元素
$(':focus') //选择 当前选取焦点的所有元素
登录后复制
jquery内容过滤选择器
①：contains(text) 选取包含指定文本的元素
$("div:contains('Runob')") // 选取包含 Runob文本的元素
登录后复制
②：empty 选取不包含子元素或文本的空元素
$("td:empty") //选取不包含子元素或者文本的tb空元素
登录后复制
③：has(selector) 选取含有选择器匹配元素的元素
$("div:has('.mini')") //选取含有class为mini元素 的div元素
登录后复制
④：parent 选取包含子元素或文本的空元素
$("div:parent") //选取含有子元素或者文本的div元素
登录后复制
jquery可见性过滤选择器
①：hidden 选取不可见的元素
$("li:hidden") //选取所有不可见元素，或type为hidden的元素,例：
登录后复制
②：visible 选取可见的元素
$("li:visible") //选取所有可见 li 元素
登录后复制
jquery属性过滤选择器
①[attribute] 选取拥有此属性的元素
$('div[title]') //选取含有 属性title 的div元素
登录后复制
②[attribute=value] 选取属性值为value的元素
$('div[title=test]') //选取 属性title值等于 test 的div元素
登录后复制
③[attribute!=value] 选取属性值不等于value的元素
$('div[title!=test]') //选取 属性title值不等于 test 的div元素
登录后复制
④[attribute^=value] 选取属性值以value开始的元素
$('div[title^=te]') //选取 属性title值 以 te 开始 的div元素
登录后复制
⑤[attribute$=value] 选取属性值以value结束的元素
$("div[title$=est]") //选取 属性title值 以 est 结束 的div元素
登录后复制
⑥[attribute*=value] 选取属性值含有value的元素
$("div[title*=es]") //选取 属性title值 含有 es 的div元素
登录后复制
⑦[attribute|=value] 选取属性值等于value或前缀为value(即”value-xxx”)的元素
$('div[title|="en"]') //选取 属性title等于en或以en为前缀（该字符串后跟一个连字符'-'）的元素
登录后复制
⑧[attribute~=value] 选取属性值用空格分隔的值中包含给定值的元素
$('div[title~="uk"]')//选取 属性title用空格分隔的值中包含字符uk的元素
登录后复制
⑨[attribute1][attribute2]…[attributeN] 组合属性选择器
$("div[id][title*=es]") //组合属性选择器,首先选取有属性id的div元素，然后在结果中 选取属性title值 含有 es 的元素
登录后复制
jquery状态过滤选择器
①：enabled 选取可用的元素
$("input:enabled") // 选取可用的 input
登录后复制
②：[attribute=value] 选取不可用的元素
$("input:disabled") // 选取不可用的 input
登录后复制
③：checked 选取选中的元素
$("input:checked") // 选取选中的 input
登录后复制
④：selected 选取选中的元素
$("option:selected") // 选取选中的 option
登录后复制
jquery子元素过滤选择器
①：first-child 选取每个父元素下的第一个子元素，返回集合元素
//选取每个父元素下的第一个子元素$('div.one :first-child')
登录后复制
②：last-child 选取每个父元素下的最后一个子元素，返回集合元素
//选取每个父元素下的最后一个子元素$('div.one :last-child')
登录后复制
③：only-child 选取每个父元素下的唯一子元素，返回集合元素
//如果父元素下的仅仅只有一个子元素，那么选中这个子元素$('div.one :only-child')
登录后复制
④：nth-child(index)选取每个父元素下的第index个子元素或者奇偶元素，index从1算起
//选取每个父元素下的第2个子元素$('div.one :nth-child(2)')
登录后复制
总结：以上就是几种常见jquery过滤选择器的全部介绍，大家可以动手使用这些过滤选择器来实现自己想要的效果。希望能对大家的学习有所帮助，更多相关教程请访问jQuery视频教程，JavaScript视频教程，bootstrap视频教程！
以上就是jquery的过滤选择器有哪些？常用的过滤选择器有哪些？的详细内容，更多请关注【创想鸟】其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至253000106@qq.com举报，一经查实，本站将立刻删除。
发布者：PHP中文网，转转请注明出处：https://www.chuangxiangniao.com/p/2738648.html
