<!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. 二、Python流程控制练习题

    一.分支结构-if等 练习题: 练习1:英制单位与公制单位互换 练习2:掷骰子决定做什么 练习3:百分制成绩转等级制 练习4:输入三条边长如果能构成三角形就计算周长和面积 练习5:个人所得税计算器 练 ...

  2. 什么是CPU缓存

    一.什么是CPU缓存 1. CPU缓存的来历 众所周知,CPU是计算机的大脑,它负责执行程序的指令,而内存负责存数据, 包括程序自身的数据.在很多年前,CPU的频率与内存总线的频率在同一层面上.内存的 ...

  3. Linux自动执行任务

    Linux自动执行任务 耗奇害死猫关注 2018.01.04 10:19:45字数 74阅读 142 单次执行用at和batch,周期性任务执行用crontab.任务执行结束后会将结果返回给发起人,通 ...

  4. SpringMVC MVC 架构模式

    MVC 架构模式 MVC(Model.View 和 Controller)是一种架构模式,它是按照职责划分的思想将系统操作分为三个模块进行处理,每个模块负责一个职责,而且模块之间可以相互交互通信,共同 ...

  5. python 如何让俩个对象相等及如何让俩个对象具有相同的id值

  6. 只需5分钟!一文读懂CSS布局(二) -- flex布局

    目录 简介 基本概念 容器属性 1. flex-direction 测试代码 2. flex-wrap 3. flex-flow 4. justify-content 5. align-items 6 ...

  7. 五分钟带你读懂 堆 —— heap(内含JavaScript代码实现!!)

    一.概念  说起堆,我们就想起了土堆,把土堆起来,当我们要用土的时候,首先用到最上面的土.类似地,堆其实是一种优先队列,按照某种优先级将数字"堆"起来,每次取得时候从堆顶取.  堆 ...

  8. IDEA 通过ctrl+滚轮缩放字体大小

    能用图解决的问题,尽量简单粗暴通俗易懂 1.第一种方式 2.第二种方式

  9. Go语言练习---判断闰年以及根据现在的秒数求现在的年月日

    package main import ( "fmt" "math" "time" ) /* @闰年判断 ·封装一个函数判断某一个年份是不是 ...

  10. typeof的作用及用法

    typeof的作用及用法 1.检查一个变量是否存在,是否有值. typeof在两种情况下会返回"undefined":一个变量没有被声明的时候,和一个变量的值是undefined的 ...