一、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. git无法同步

    出现问题: fatal: destination path 'test' already exists and is not an empty directory. 解决方法如下: git init ...

  2. Spark基础-scala学习（二、面向对象）

    面向对象编程之类 //定义一个简单的类 scala> :paste // Entering paste mode (ctrl-D to finish) //类默认public的 class He ...

  3. linux上安装jdk环境

    只在于安装jdk1.6.jdk1.7和jdk1.8,其他版本请绕行,目的在于方便自己和大家以后急于做jdk环境,苦于没有jdk安装包和设置变量的过程,我将安装包均放在云盘中, 需要直接在连接中找即可: ...

  4. 1 分钟教会你用 Spring Boot 发邮件

    Spring Boot 提供了一个发送邮件的简单抽象,使用的是下面这个接口. org.springframework.mail.javamail.JavaMailSender Spring Boot ...

  5. JAVA面试题-数组字符串基础

    1.大写的Integer和String是可变类还是不可变类?怎么定义不可变类?不可变.用final关键字,如public final class Integer extends Number 2.比较 ...

  6. app测试之专项测试

    专项测试包含很多东西,安装.升级.卸载.性能.安全.网络.随机等等,这些都属于专项测试 一个app的正常到用户手里使用,功能是最基础的测试,专项测试测试主要的. 下面介绍一些常用的专项测试: 1.多任 ...

  7. python中np.multiply（）、np.dot（）和星号（*）三种乘法运算的区别（转）

    为了区分三种乘法运算的规则,具体分析如下: import numpy as np 1. np.multiply()函数 函数作用 数组和矩阵对应位置相乘,输出与相乘数组/矩阵的大小一致 1.1数组场景 ...

  8. python不同开根号速度对比

    import time import math import numpy as np def timeit1(): s = time.time() for i in range(750000): z= ...

  9. jvm详情——5、选择合适的垃圾收集算法

    回收器选择JVM给了三种选择:串行收集器.并行收集器.并发收集器,但是串行收集器只适用于小数据量的情况,所以这里的选择主要针对并行收集器和并发收集器. 默认情况下,JDK5.0以前都是使用串行收集器, ...

  10. Tomcat8源码笔记(五)组件Container分析

    Tomcat8源码笔记(四)Server和Service初始化 介绍过Tomcat中Service的初始化 最先初始化就是Container,而Container初始化过程是咋样的? 说到Contai ...