<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
    <title></title>
    <style>
    div {
        width: 100px;
        height: 90px;
        float: left;
        padding: 5px;
        margin: 5px;
        background-color: #EEEEEE;
    }
      .c{display:none;
      }
    </style>
    <script

src="https://www.imooc.com/static/lib/jquery/1.9.1/jquery.js"></script>
</head>

<body>  
  <div id="aaron">
     <p>id="aaron"</p>
     <p>选中</p>
    </div>
    <div class="imooc">
        <p>id="imooc"</p>
        <p>jQuery选中</p>
    </div>
    <div class="left imooc" title = "empty测试" id="cs"></div>
    <div class="c">测试隐藏</div>
    <div class="div">
    <input type="radio" name="dan"/> 单选</input><br>
    <input type="radio" name="dan"/> dan</input>
    </div>
    <script type="text/javascript">
       //通过原生方法处理
        var div = document.getElementById('aaron');
        div.style.border = "3px solid blue";
    </script>

<script type="text/javascript">
     //通过jQuery直接传入id
     //id的唯一,只选择到了第一个匹配的id为imooc的div节点
        $(".imooc:contains(jQuery选中)").css("border", "3px solid red");<!--元素

(标签)内空格都不允许存在-->
    </script>
    <script type="text/javascript">
      $(".imooc:empty").css("border-left","3px dotted #00ffff");
      $(".imooc:empty").css("border-right","3px dotted red");
      $(".imooc>p:first-child").css("border","5px solid yellow");
      $("#cs").css("border-bottom","5px solid blue");
      $(".c:hidden").css("border","5px solid blue");
      $(".div>input:first-child").css("border","5px solid blue");
  </script>
</body>

</html>

jQuery筛选选择器的更多相关文章

  1. jquery-5 jQuery筛选选择器

    jquery-5  jQuery筛选选择器 一.总结 一句话总结:选择器加动态添加方法可以不用想方法名,这个简单方便. 1.筛选选择器有哪三种? 过滤 查找 串联 1.过滤 eq();first(); ...

  2. Jquery 筛选选择器

    筛选选择器(方法) 既然是方法 那就应该对象调用   obj.metch(); $(“.dd”).children("ul"),show();           //找到.dd下 ...

  3. jQuery的筛选选择器

    基本筛选选择器 很多时候我们不能直接通过基本选择器与层级选择器找到我们想要的元素,为此jQuery提供了一系列的筛选选择器用来更快捷的找到所需的DOM元素.筛选选择器很多都不是CSS的规范,而是jQu ...

  4. jQuery选择器之表单对象属性筛选选择器

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-type" content ...

  5. jQuery选择器之属性筛选选择器

    在这么多属性选择器中[attr="value"]和[attr*="value"]是最实用的 [attr="value"]能帮我们定位不同类型 ...

  6. jQuery---jq基础了解(语法,特性),JQ和JS的区别对比,JQ和JS相互转换,Jquery的选择器(基础选择器,层级选择器,属性选择器),Jquery的筛选器(基本筛选器,表单筛选器),Jquery筛选方法

    jQuery---jq基础了解(语法,特性),JQ和JS的区别对比,JQ和JS相互转换,Jquery的选择器(基础选择器,层级选择器,属性选择器),Jquery的筛选器(基本筛选器,表单筛选器),Jq ...

  7. jquery 表单对象属性筛选选择器

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-type" content ...

  8. jquery 子元素筛选选择器

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-type" content ...

  9. jquery 属性筛选选择器

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-type" content ...

随机推荐

  1. CRM系统推动教育行业数字化转型

    目前,教育培训的潜在市场规模巨大,并且保持着迅猛的发展态势.同时,随着众多外资企业不断涌入中国市场,与国内大大小小的培训机构展开竞争,所以教育行业的竞争也是非常的激烈.传统的教育行业亟待数字化转型,才 ...

  2. C#·对于BOM头之完全解决方案

    阅文时长 | 0.46分钟 字数统计 | 798.4字符 主要内容 | 1.引言&背景 2.使用C#写入带有/不带有BOM头的文件? 3.对于读取文件时,避免BOM头造成的异常. 4.声明与参 ...

  3. 关于文字内容过长,导致文本内容超出html 标签宽度的解决方法之自动换行

    在标签的style 属性中设置 word-break style="word-break:break-all;" 这样就可以实现换行 上截图没设置之前 设置之后 完美解决!!!!! ...

  4. Linux_yum命令详解

    一.yum命令语法 yum [options] [command] [package ...] 二.yum命令常用的选项: yum options -y //自动回答为"yes" ...

  5. make clean 和 make distclean区别-(转自秋水Leo)

    make clean仅仅是清除之前编译的可执行文件及配置文件. 而make distclean要清除所有生成的文件. Makefile 在符合GNU Makefiel惯例的Makefile中,包含了一 ...

  6. STM32 中的HARDFAULT 的查找方法

    http://blog.csdn.net/zyboy2000/article/details/7668331

  7. 使用 .NET 升级助手将.NET Framework应用迁移到.NET 5

    从.NET Framework 迁移到.NET 5 犹如搬家,我们都知道搬家是很痛苦的,我们请求搬家公司来减轻我们的压力,.NET 升级助手 的作用就类似我们聘请的搬家公司,帮助我们处理繁重乏味的迁移 ...

  8. 又卡了~从王者荣耀看Android屏幕刷新机制

    前言 正在带妹子上分的我,团战又卡了,我该怎么向妹子解释?在线等. "卡"的意思 不管是端游还是手游,我们都会时不时遇到"卡"的时候,一般这个卡有两种含义: 掉 ...

  9. 第三方数据格式库protobuf

    protobuf初识 protobuf是一种高效的数据格式,平台无关.语言无关.可扩展,可用于 RPC 系统和持续数据存储系统. protobuf protobuf介绍 Protobuf是Protoc ...

  10. Java | Stream流、泛型、多线程 | 整理自用

    1.lambda 表达式 lambda 的延迟执行 可以对程序进行优化,尤其是使用 if {} else {} 条件判断,先判断条件是否成立,再传入计算好的参数. functionName( para ...