<!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. 删除所有空白列 cat yum.log | awk '{$1=$2=$3=$4=null;print $0}'>>yum.log1 sed ‘s/[ \t]*$//g' 删除所有空格 sed -i s/[[:space:]]//g yum.log

    2.删除行末空格 代码如下: 删除所有空白列 cat yum.log | awk '{$1=$2=$3=$4=null;print $0}'>>yum.log1 sed 's/[ \t]* ...

  2. 【转载】kvm迁移

    https://www.jianshu.com/p/60132085a3c9 kvm分静态和动态迁移,静态就是关机迁移,比较简单,动态迁移就是不关闭服务器进行迁移.静态迁移:确定虚拟机关闭 https ...

  3. Zabbix 自动发现并监控磁盘IO、报警 引言

    引言 Zabbix并没有提供模板来监控磁盘的IO性能,所以我们需要自己来创建一个,由于一台服务器中磁盘众多,如果只有一两台可以手动添加,但服务集群达到几十那就非常麻烦,因此需要利用自动发现这个功能,自 ...

  4. touch -d 同时修改atime与mtime

    1.touch命令 touch命令用于创建空白文件或设置文件的时间,格式为"touch [选项] [文件]". 在创建空白的文本文件方面,这个touch命令相当简捷,简捷到没有必要 ...

  5. Ansible_常用模块

    一.Ansible常用模块 1.ansible常用模块command.shell.raw的区别: command模块不是调用的shell的指令,所以没有bash的环境变量 shell模块调用的/bin ...

  6. Log4j 配置多个 Logger

    引言 Log4j 是 Java 的主流日志框架,通过灵活的配置可以提供各种类型的日志服务. 在使用 Log4j 进行实际项目开发的过程中,有时不想使用 rootLogger 记录器,把所有的日志都输出 ...

  7. Mui入门(Day_42)

    开始体验Mui 1. 安装HbuilderX 下载地址:https://www.dcloud.io/hbuilderx.html 2. 新建Mui项目 3. 文件结构介绍 _ css : 样式表文件 ...

  8. JVM-运行时数据区之PC寄存器

    1.运行时数据区图 运行时数据区是在类加载完成后所经历的阶段,当我们通过前面的:类的加载 --> 验证 --> 准备 --> 解析 --> 初始化,这几个阶段完成后,执行引擎就 ...

  9. Selenium3自动化测试【18】XPath定位元素(2)

    层级与属性结合定位 如果被定为的元素,无法通过自身属性来唯一标识自己,此时可以考虑借助上级元素来定位自己.举生活中的例子,一个婴儿刚出生,还没有姓名与身份证号,此时给婴儿进行检查时往往会标注为&quo ...

  10. openresty 学习笔记番外篇:python访问RabbitMQ消息队列

    openresty 学习笔记番外篇:python访问RabbitMQ消息队列 python使用pika扩展库操作RabbitMQ的流程梳理. 客户端连接到消息队列服务器,打开一个channel. 客户 ...