jQuery中的过滤性选择器有哪些

jquery中的选择器有很多，比如子元素选择器，后代选择器，过滤性选择器等等，这篇文章就和大家讲讲jquery中的过滤性选择器，正在学习选择器的朋友可以参考一下，希望对你有帮助。

:first和:last过滤选择器

:first得到一组相同标签元素中的第1个元素
:last得到一组相同标签元素中的最后1个元素
例如：

  
改变最后一行"苹果"背景颜色：
  

    
葡萄
    
香蕉
    
橘子
    
西瓜
    
苹果
  
       

:contains(text)过滤选择器

:contains(text)选择包含指定字符串的全部元素，它通常与其他元素结合使用，获取包含“text”字符串内容的全部元素对象
例如：

  
改变包含"jQuery"字符内容的背景色：
  

    
强大的"jQuery"
    
"javascript"也很实用
    
"jQuery"前端必学
    
"java"是一种开发语言
    
前端利器——"jQuery"
  

:has(selector)过滤选择器

:has(selector)过滤选择器的功能是获取选择器中包含指定元素名称的全部元素
例如：

  
改变包含"label"元素的背景色：
  

    
我是P先生
    
L妹纸就是我
    
我也是P先生
    
我也是L妹纸哦
    
P先生就是我哦
  

:hidden过滤选择器

:hidden过滤选择器的功能是获取全部不可见的元素，这些不可见的元素中包括type属性值为hidden的元素
例如：

  
显示隐藏元素的内容
  
  

  

:visible过滤选择器

Nextcloud Server

Nextcloud服务器是一款免费且开源的服务器软件，它允许您将所有数据存储在您选择的服务器上。通过Nextcloud，您可以轻松访问和存储位于您信任的数据中心的数据，将数据在各种设备之间同步，并共享您的数据以进行协作。它提供了自托管文件同步和共享领域中最佳的安全性，并且可以通过数百个应用进行扩展。

下载

:visible过滤选择器获取的是全部可见的元素，也就是说，只要不将元素的display属性值设置为“none”，那么，都可以通过该选择器获取。
例如：

  
修改可见“水果”的背景色
  

    
橘子
    
香蕉
    
葡萄
    
苹果
    
西瓜
  
  

[attribute=value]属性选择器

[attribute=value]属性选择器的功能是获取与属性名和属性值完全相同的全部元素，其中[]是专用于属性选择器的括号符，参数attribute表示属性名称，value参数表示属性值。
例如：

  
改变"title"属性值为"蔬菜"的背景色
  

    
茄子
    
香蕉
    
芹菜
    
苹果
    
西瓜
  
  

[attribute!=value]属性选择器

[attribute!=value]属性选择器的功能是获取不包含属性名，或者与属性名和属性值不相同的全部元素，其中[]是专用于属性选择器的括号符，参数attribute表示属性名称，value参数表示属性值。

[attribute*=value]属性选择器

[attribute*=value]它可以获取属性值中包含指定内容的全部元素，其中[]是专用于属性选择器的括号符，参数attribute表示属性名称，value参数表示对应的属性值。
例如：

  
改变"title"属性值包含"果"的背景色
  

    
茄子
    
香蕉
    
芹菜
    
小西红柿
    
西瓜
  
  

:first-child子元素过滤选择器

:first-child子元素过滤选择器则可以获取每个父元素中返回的首个子元素，它是一个集合，常用多个集合数据的选择处理。
例如：

  
改变每个"蔬菜水果"中第一行的背景色
  

    
芹菜
    
茄子
    
萝卜
    
大白菜
    
西红柿
  
  

    
橘子
    
香蕉
    
葡萄
    
苹果
    
西瓜
  
  

:last-child子元素过滤选择器

与:first-child子元素过滤选择器功能相反，:last-child子元素过滤选择器的功能是获取每个父元素中返回的最后一个子元素，它也是一个集合，常用多个集合数据的选择处理。