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. jquery 返回上一页 ，关闭js代码

    1.关闭功能: $(“#guanbi”).live("click",function()){ window.close(); } 2.返回上一页: <a href=" ...

  2. gameui-for-phaser-js更新到最新版本

    Hola Cantk是一个功能强大的游戏引擎,它拥有丰富的GUI控件,配合Hola Studio可以快速开发出游戏的UI界面.Phaser是一个流行而且强大的游戏引擎,但是它的GUI控件很少,而且缺乏 ...

  3. cxf的soap风格+spirng4+maven 客户端

    上篇博客介绍了,cxf的soap风格的服务端,现在我们写客户端来调用 1.pom.xml <project xmlns="http://maven.apache.org/POM/4.0 ...

  4. 51nod 1183 编辑距离(dp)

    题目链接:51nod 1183 编辑距离 #include<cstdio> #include<cstring> #include<algorithm> using ...

  5. js面向对象选项卡

    window.onload=function() //面向对象 { var tab=new tabSwitch("div1"); var tab=new tabSwitch(&qu ...

  6. Java：多线程<四> Lock、停止线程、守护线程、join、优先级&yield

    Java1.5以后,Condition将Object监视器方法(wait, notify, notifyAll)分解成截然不同的对象,以便通过这些对象与任意Lock实现组合使用为每个对像提供多个等待s ...

  7. 一个关于自定义类型作为HashMap的key的问题

    在之前的项目需要用到以自定义类型作为HashMap的key,遇到一个问题:如果修改了已经存储在HashMap中的实例,会发生什么情况呢?用一段代码来试验: import java.util.HashM ...

  8. JS 百度地图导航

    上一篇文章中我们就简单的学习了HTML5 地理定位,那么今天告诉大家我在项目中遇到的一个问题吧,就是怎么实现点击一个按钮就可以调到百度地图,并且获取到你当前的位置,并且导航到指定的地方去. 不想看步骤 ...

  9. css浮动（folat），清除浮动（clear）（另加两种清除浮动方式，总共三种清除浮动方式）

    css浮动(float) float是css样式,用于设置标签的居左浮动和居右浮动,浮动后的元素不属于html文档流,需要用清除浮动把文档拽回到文档流中 浮动值: left:向左浮动 right:向右 ...

  10. IT公司100题-25-求字符串中的最长数字串

    问题描述: 实现一个函数,求出字符串中的连续最长数字串.例如输入”12345cbf3456″,输出”12345″. 函数原型为: void conti_num_max( const char * sr ...