一、Jquery的内容过滤选择器：

内容过滤选择器： 
1、:contains(text) 选取含有文本内容为text的元素 
2、 :empty 选取不包含子元素或者文本为空的元素 
3、:has(selector) 选取含有选择器所匹配元素的元素 
4、:parent 选取含有子元素或者有文本的元素

效果：

源码：

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>jquery 学习1</title>

<!--  导入jquery库 -->

<script type="text/javascript" src="jquery/jquery.js"></script>

<script type="text/javascript">

$(function(){

    $("#btn1").click(function(){

        $("div:contains('di')").css("background","#FFBBAA");

    });

    $("#btn2").click(function(){

        $("div:empty").css("background","#FFBBAA");

    });

    $("#btn3").click(function(){

        $("div:has('#d2')").css("background","#FFBBAA");

    });

    $("#btn4").click(function(){

        //$(":parent").css("background","#FFBBAA");

        $("div:parent").css("background","#FFBBAA");

//         $("div:not(:empty)").css("background","#FFBBAA");

    });

})

</script>

</head>

<body>

Jquery的内容过滤选择器：

内容过滤选择器：

<br>

、:contains(text) 选取含有文本内容为text的元素

<br>

、  :empty      选取不包含子元素或者文本为空的元素

<br>

、:has(selector)   选取含有选择器所匹配元素的元素

<br/>

、:parent         选取含有子元素或者有文本的元素

<br/>

<hr>

<button id="btn1">选取含有文本di的div</button>

<button id="btn2">选取无子元素或者文本为空的元素</button>

<button id="btn3">选取含有某个选择器的元素</button>

<button id="btn4">选取含有子元素或者有文本的元素</button>

<p>

子层

<div id="d1"> 孙子层d1  </div>

<span>  这是一个行信息</span>

<div>

div 孙子层

</div>

</p>

<h1>这是h1 不在div内</h1>

<hr>

<div  id="d33"> 

<h2>这是h2 在div内</h2>

子层2

<div style="background:#FFFFFF"> 孙子层2   </div>

<br/>

<span> 这是一个行信息2</span>

<div id="d2">

div 孙子层2

</div>

</div>

<br/>

<div>

这是第三个div层

</div>

<br/>

<span>这是第四个span</span>

<p>

<div style="background:#FF00FF "></div>

<div id="d5"> 这是第5个层</div>

</p>

</body>

</html>

(7)Jquery1.8.3快速入门_内容过滤选择器的更多相关文章

  1. (8)Jquery1.8.3快速入门_可见性选择器

    一.Jquery的可见性选择器: 可见性选择器: 1.:visable 筛选可以见的元素 2. :hidden 筛选不可见的元素 效果: 源码: <!DOCTYPE html> <h ...

  2. (6)Jquery1.8.3快速入门_过滤选择器

    一.Jquery的基本过滤选择器: 基本过滤选择器: 1. :first 选取第一个元素 2. :last 选取最后一个元素 3.:not(selector) 去除所有与给定的选择器匹配的元素 4.: ...

  3. (5)Jquery1.8.3快速入门_层次选择器

    一.Jquery的选择器: 层级选择器: 1.空格                div    span              div中的包含的所有span后代元素 2. >        ...

  4. (4)Jquery1.8.3快速入门_基本选择器

    一.Jquery选择器: 基本选择器: 1.id                           #id      根据元素的id获取的唯一元素. 2.class                  ...

  5. Spring_MVC_教程_快速入门_深入分析

    Spring MVC 教程,快速入门,深入分析 博客分类: SPRING Spring MVC 教程快速入门  资源下载: Spring_MVC_教程_快速入门_深入分析V1.1.pdf Spring ...

  6. 【笔记目录2】【jessetalk 】ASP.NET Core快速入门_学习笔记汇总

    当前标签: ASP.NET Core快速入门 共2页: 上一页 1 2  任务27:Middleware管道介绍 GASA 2019-02-12 20:07 阅读:15 评论:0 任务26:dotne ...

  7. jQuery选择器之内容过滤选择器Demo

    测试代码: 04-内容过滤选择器.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" &q ...

  8. 黑马day16 jquery&amp;内容过滤选择器&amp;可见度选择器

    内容过滤选择器的过滤规则主要体如今它所包括的子元素和文本内容上 .:contains(text) 使用方法: $("div:contains('John')")    返回值  集 ...

  9. JQuery 内容过滤选择器

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...

随机推荐

  1. 本周对于java中lamdba表达式与内部进行了学习 ，以下是我在学习就中遇到的问题

    在java中,可以将一个类定义在另一个类里面或者一个方法里面,这样的类称为内部类.我觉得其实就是类的嵌套,在一个类中再定义一个类,这里已成员内部类为讲,内部类可以自由地运用外部类定义的方法,但外部类想 ...

  2. c++ 实现hashmap

    由于hashmap不是c++ stl中标准实现,这样在跨平台使用时就可能会出现问题,于是想到自己实现一个hashmap hash算法使用开链法解决hash冲突,主要实现了添加,删除,查找几个方法 头文 ...

  3. mysql 连接 的drive 不一样

          DB_DRIVER 为任意名 com.mysql.jdbc.Driver 是 mysql-connector-java 5(jar包)com.mysql.cj.jdbc.Driver 是 ...

  4. python爬虫学习之XPath基本语法

    XPath 使用路径表达式来选取 XML 文档中的节点或节点集.节点是通过沿着路径(path)或者步(steps)来选取的. XML实例文档 我们将在下面的例子中使用这个XML文档. <?xml ...

  5. HotSpot 的垃圾收集器

    上图展示了7种作用于不同分代的收集器,如果两个收集器之间存在连线,就说明它们可以搭配使用,收集器所处的区域,则表示它是属于新生代还是老年代收集器. 并行(Parallel):指多条垃圾收集器线程并行工 ...

  6. 排序函数 sort() 和 高阶函数sorted()

    · sorted():该函数第一个参数iterable为任意可以迭代的对象,key是用于比较的关键字,reverse表示排序结果是否反转. · L.sort():该函数的三个参数和 sorted() ...

  7. Kubernetes 服务入口管理 Traefik Ingress Controller

    前面部署了 kubernetes/ingress-nginx 作为 Ingress Controller,使用 Nginx 反向代理与负载,通过 Ingress Controller 不断的跟 Kub ...

  8. mysql 开发进阶篇系列 8 锁问题 (共享锁与排它锁演示)

    1 .innodb 共享锁(lock in share mode)演示 会话1 会话2 SET autocommit=0; SELECT cityname FROM  city WHERE city_ ...

  9. Android--Menus

    前言 本篇博客讲解一下菜单Menu的使用.菜单在windows应用中使用十分广泛,几乎所有的windows应用都有菜单,Android中也加入了菜单的支持.从官方文档了解到,从Android3.0(A ...

  10. Python爬虫、自动化常用库&帮助文档URL

    一.Python下载地址 Windows终端Cmder.exe下载--->http://cmder.net/ Python下载(Windows)        ---> https://w ...