HTML示例代码

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<!--HTML区域-->
<h1>第一个标题</h1>
<div class="nav-2014">
<div class="w">
<div class="w-spacer"></div>
<div class="categorys">
<div class="dt">家用电器分类</div>
<div class="dp">家用电器价格</div>
</div>
<span class="hr"></span>
<div class="navitems-2014">
<div id="treasure"></div>
<span class="clr"></span>
<span class="chr"></span>
男:<input type="checkbox" checked="checked" value="nan">
女:<input type="checkbox" value="nv">
</div>
</div>
</div>
<h2>第二个标题</h2>
<div id="electronic">
<div id="firstScreen">1
<div class="w">2</div>
</div>
<ul>
<div class="u_c" lang="en-us"></div>
<li class="ui-switch-curr">第一</li>
<li class="ui-switch-item"></li>
<li class="ui-switch-next">第三</li>
<li class="ui-switch-sub">第四</li>
</ul>
<div class="secord_screen">
<div></div>
</div>
<div class="third_screen"></div>
</div>
</body>
</html>

  1、contains:  包含选择器,匹配包含给定文本的元素

  2、empty:  空元素选择器,匹配所有不包含子元素或文本的空元素

  3、parent: 内容选择器,匹配所有含有子元素或文本的元素

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

    <!--jquery区域-->
<script src="jquery-3.1.0.js"></script>
<script>
// 包含'家用'文本的所有div标签及其其父标签
$("div:contains('家用')")
// 匹配所有不包含子元素且空文本的div元素,官网说这是或的关系
$("div:empty")
// 匹配所有包含子元素或文本的div标签
$("div:parent")
// 给含有div标签的ul标签添加一个test类
$("ul:has('div')").addClass('test')
</script>

  

jquery选择器之内容选择器的更多相关文章

  1. 深入学习jQuery选择器系列第五篇——过滤选择器之内容选择器

    × 目录 [1]contains [2]empty [3]parent[4]has[5]not[6]header[7]lang[8]root 前面的话 本文介绍过滤选择器中的内容选择器.内容选择器的过 ...

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

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

  3. jquery选择器之内容过滤选择器

    先写出DOM元素的HTML结构: <style type="text/css"> /*高亮显示*/ .highlight{ background-color: gray ...

  4. jQuery选择器之属性选择器Demo

    测试代码: 06-属性选择器.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" &quo ...

  5. jQuery选择器之层次选择器Demo

    测试代码: 02-层次选择器.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" &quo ...

  6. jQuery选择器之基本选择器Demo

    测试代码: 01-基本选择器.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" &quo ...

  7. jQuery选择器之id选择器

    页面的任何操作都需要节点的支撑,开发者如果快速高效的找到指定的节点也是前端开发中的一个重点.jQuery提供了一系列的选择器帮助开发者达到这一目的,让开发者可以更少的处理复杂选择过程与性能优化,更多专 ...

  8. jquery选择器之属性选择器

    [attribute]   匹配指定属性名的所有元素 [attribute=value] 匹配给定的属性名是某个特定值的属性 [attribute!=value] 匹配给定的属性名不是某个特定值的属性 ...

  9. jquery选择器之层级选择器

    HTML示例代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...

随机推荐

  1. 转!!mybatis在xml文件中处理大于号小于号的方法

    第一种方法: 用了转义字符把>和<替换掉,然后就没有问题了. SELECT * FROM test WHERE 1 = 1 AND start_date  <= CURRENT_DA ...

  2. 在centos6.5中安装github的客户端git

    简介 git是一个分布式版本控制软件,我采用的采用的安装方式是源码安装 1.安装编译git时需要的包 # yum install curl-devel expat-devel gettext-deve ...

  3. WampServer Version 2.5 bug修改

    做PHP开发都需要安装PHP的运行环境,为了方便,网上可以下载到好多的集成环境,最近使用WampServer Version 2.5发现有一些bug,分享一下修改的方法.高手请路过. 1.echo d ...

  4. "struct"类型重定义解决办法

    #ifndef 在头文件中的作用 在一个大的软件工程里面,可能会有多个文件同时包含一个头文件,当这些文件编译链接成一个可执行文件时,就会出现大量 “重定义”的错误. 在头文件中使用#ifndef #d ...

  5. CentOS7下安装Tomcat

    1.下载tomcat. 测试tomcat版本为:apache-tomcat-8.5.6.tar.gz.下载地址:http://tomcat.apache.org/download-80.cgi. 2. ...

  6. WCF初探-1:认识WCF

    1.WCF是什么? WindowsCommunication Foundation(WCF)是由微软发展的一组数据通信的应用程序开发接口,它是.NET框架的一部分,由.NET Framework 3. ...

  7. @HTML.checkboxFor()用法

    <%=Html.CheckBox("chk1",true) %> <%=Html.CheckBox("chk1", new { @class= ...

  8. JavaWeb Chapter 7 监听器

    1.  监听器Session.request.context对象属性的变化: 2.  三个对象都有生命周期和属性改变的监听: 3.  Session另外还有会话迁移和对象绑定的监听: 4.  Sess ...

  9. 用Handler图片轮播练习

    XML代码 <?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:andr ...

  10. 高性能Mysql

      高性能 高可用 易伸缩 安全 高并发 定义 吞吐量(单位时间内多少次查询) MTBF(平均失效时间) MTTR(平均恢复时间)     同时工作的线程数或连接数 系统       事务 表锁.行级 ...