jQuery中内容过滤器的使用方法

这次给大家带来jQuery中内容过滤器的使用方法,使用jQuery中内容过滤器的注意事项有哪些,下面就是实战案例,一起来看一下。

本文实例讲述了jQuery中内容过滤器简单用法。分享给大家供大家参考,具体如下:

一 介绍

内容过滤器就是通过DOM元素包含的文本内容以及是否含有匹配的元素进行筛选。内容过滤器共包括:contains(text)、:empty、:has(selector)和:parent4种,如下表所示。

过滤器说明示例contains(text)匹配包含给定文本的元素$(“li:contains(‘DOM’)”)    //匹配含有“DOM”文本内容的li元素:empty匹配所有不包含子元素或者文本的空元素$(“td:empty”)   //匹配不包含子元素或者文本的单元格:has(selector)匹配含有选择器所匹配元素的元素$(“td:has(p)”)    //匹配表格的单元格中含有

标记的单元格

:parent匹配含有子元素或者文本的元素$(“td: parent”)    //匹配不为空的单元格,即在该单元格中还包括子元素或者文本

二 应用

应用内容过滤器匹配为空的单元格、不为空的单元格和包含指定文本的单元格

三 代码

编号 祝福对象 祝福者 字条内容 发送时间
1 琦琦 妈妈 愿你健康快乐的成长! 2011-07-05 13:06:06
1 wgh 爸爸 愿你健康快乐的成长! 2011-07-05 13:06:06
1 花花 wgh 愿你健康快乐的成长! 2011-07-05 13:06:06
1 科科 wgh 2011-07-05 13:06:06
$(document).ready(function() { $("td:parent").css("background-color","#E8F3D1"); //为不为空的单元格设置背景颜色 $("td:empty").html("暂无内容"); //为空的单元格添加默认内容 $("td:contains('wgh')").css("color","red"); //将含有文本wgh的单元格的文字颜色设置为红色 });

登录后复制

四 运行结果

jQuery中内容过滤器的使用方法

相信看了本文案例你已经掌握了方法,更多精彩请关注【创想鸟】其它相关文章!

推荐阅读:

怎样使用VUE减少对服务器的请求次数

Vue怎么使用CDN优化首屏加载的速度

以上就是jQuery中内容过滤器的使用方法的详细内容,更多请关注【创想鸟】其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/2774456.html

(0)
上一篇 2025年3月8日 14:07:12
下一篇 2025年3月7日 22:14:53

AD推荐 黄金广告位招租... 更多推荐

相关推荐

  • jQuery可见性过滤器的用法详解

    这次给大家带来jQuery可见性过滤器的用法详解,使用jQuery可见性过滤器的注意事项有哪些,下面就是实战案例,一起来看一下。 本文实例讲述了jQuery中可见性过滤器简单用法。分享给大家供大家参考,具体如下: 一 介绍 元素的可见状态有…

    2025年3月8日
    200
  • jQuery代码实现图片定时轮播

    本文给大家分享的是jQuery代码实现图片定时轮播,非常的详细,也很实用,适合jQuery的初学者,有需要的小伙伴参考下。 nbsp;html>*{ margin: 0; padding: 0;}ul{ list-style: non…

    2025年3月8日
    200
  • 利用jQuery实现Ajax的封装的步骤分享

    本篇文章给大家分享的内容是利用jQuery实现Ajax的封装的步骤分享,有着一定的参考价值,有需要的朋友可以参考一下 load方法 load(url,[data],[callback])。data为提交的数据,callback为回调函数,回…

    编程技术 2025年3月8日
    200
  • Angular JQuery生成简单快递管理界面的代码分享

    本篇文章给大家分享的内容是Angular JQuery生成简单快递管理界面的代码分享,有着一定的参考价值,有需要的朋友可以参考一下 话不多说,直接上代码: nbsp;html>–按状态查询–已发货未发货id  商品名用户名手机号价…

    编程技术 2025年3月8日
    200
  • jquery实现表格动态复选框的代码分享

    本篇文章给大家分享的内容是jquery实现表格动态复选框的代码分享,有着一定的参考价值,有需要的朋友可以参考一下 效果如图 nbsp;html>                                             …

    编程技术 2025年3月8日
    200
  • 在jQuery里如何使用复合选择器

    这次给大家带来在jQuery里如何使用复合选择器,在jQuery里使用复合选择器的注意事项有哪些,下面就是实战案例,一起来看一下。 一 介绍 复合选择器将多个选择器(可以是ID选择器、元素选择或是类名选择器)组合在一起,两个选择器之间以逗号…

    编程技术 2025年3月8日
    200
  • Angular4里ElementRef的使用方法

    这次给大家带来Angular4里ElementRef的使用方法,Angular4里ElementRef使用的注意事项有哪些,下面就是实战案例,一起来看一下。 Angular 的口号是 – “一套框架,多种平台。同时适…

    编程技术 2025年3月8日
    200
  • getBoundingClientRect使用方法及兼容性处理

    这次给大家带来getBoundingClientRect使用方法及兼容性处理,getBoundingClientRect使用方法及兼容性处理的注意事项有哪些,下面就是实战案例,一起来看一下。 getBoundingClientRect的作用…

    编程技术 2025年3月8日
    200
  • React中组件的抽象使用方法

    这次给大家带来React中组件的抽象使用方法,React中组件的抽象使用注意事项有哪些,下面就是实战案例,一起来看一下。 mixin mixin的特性广泛存在于各个面向对象语言中,在ruby中,include关键词就是mixin,是将一个模…

    编程技术 2025年3月8日
    200
  • Vue组件通信Bus使用方法

    这次给大家带来Vue组件通信Bus使用方法,Vue组件通信Bus使用的注意事项有哪些,下面就是实战案例,一起来看一下。 在vue2.0中 $dispatch 和 $broadcast 已经被弃用。官方文档中给出的解释是: 因为基于组件树结构…

    编程技术 2025年3月8日
    200

发表回复

登录后才能评论