<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <ul>
        <li id="li1">1</li>
        <li class="li2">2</li>
        <li name="li3">3</li>
        <li>4</li>
        <li>5</li>
        <li>6</li>
    </ul>
    <script src="./jquery.min.js"></script>
    <script>
        // 筛选器 : 在通过选择器获取的标签对象伪数组的基础上,再次筛选出需要的标签内容
        
        // 筛选器的执行结果,也是一个伪数组
        // 筛选器是在通过选择器获取的伪数组基础上,再次筛选
        // 筛选器是为了链式编程服务
        // $('ul>li') 在 获取的 ul中li 的伪数组基础上,再次筛选
        // 伪数组中的第一个
        console.log( $('ul>li').first() );
        // 伪数组中的最后一个
        console.log( $('ul>li').last() );
        // 伪数组中按照索引下标筛选
        console.log( $('ul>li').eq(2) );
        // 伪数组中,当前标签的上一个兄弟标签
        console.log( $('ul>li').eq(2).prev() );
        // 伪数组中,当前标签的下一个兄弟标签
        console.log( $('ul>li').eq(2).next() );
        // 伪数组中,当前标签之前的所有兄弟标签,顺序是就近顺序
        console.log( $('ul>li').eq(2).prevAll() );
        // 伪数组中,当前标签之后的所有兄弟标签,顺序是就近顺序
        console.log( $('ul>li').eq(2).nextAll() );
        // 伪数组中,当前标签的所有兄弟标签,顺序是从第一个开始
        console.log( $('ul>li').eq(2).siblings() );
        // 伪数组中,当前标的直接父级标签,就一层
        console.log( $('ul>li').eq(2).parent() );
        // 伪数组中,当前标的所有父级标签,有几层算几层
        console.log( $('ul>li').eq(2).parents() );
        // 伪数组中,当前标签的索引下标
        console.log( $('ul>li').eq(2).index() );
        console.log( $('ul').find('#li1').index() );
        // 在父级标签中,按照条件筛选,找子级标签中,符合条件的标签对象 
        // 条件是任意的html,css支持的语法形式
        console.log( $('ul').find('#li1') );
        console.log( $('ul').find('.li2') );
        console.log( $('ul').find('[name="li3"]') );
    </script>
</body>
</html>

jquery的筛选器的更多相关文章

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

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

  2. jQuery 初识 筛选器 属性选择器

    ---------------------------大事使我们惊讶,小事使我们沮丧,久而久之,我们对这二者都会习以为常. 一 jQuery是什么? ［1］   jQuery由美国人John Resi ...

  3. jQuery 选择器 筛选器 样式操作 文本操作 属性操作 文档处理 事件 动画效果 插件 each、data、Ajax

    jQuery jQuery介绍 1.jQuery是一个轻量级的.兼容多浏览器的JavaScript库. 2.jQuery使用户能够更方便地处理HTML Document.Events.实现动画效果.方 ...

  4. jquery选择器筛选器

    jQuery对象 Query 对象就是通过jQuery包装DOM对象后产生的对象.jQuery 对象是 jQuery 独有的. 如果一个对象是 jQuery 对象, 那么它就可以使用 jQuery 里 ...

  5. jquery查找筛选器

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. JQuery 选择器 筛选器

    什么是jQuery对象 参考:http://jquery.cuishifeng.cn/css.html jQuery 对象就是通过jQuery包装DOM对象后产生的对象.jQuery 对象是 jQue ...

  7. jQuery基本筛选器-表单筛选器-关系筛选器

    一.基本筛选器 :first // 第一个 :last // 最后一个 :eq(index)// 索引等于index的那个元素 :even // 匹配所有索引值为偶数的元素,从 0 开始计数 :odd ...

  8. 【jQuery】总结:筛选器、控制隐藏、操作元素style属性

    筛选器 -> http://blog.csdn.net/lijinwei112/article/details/6938134 常用到的: $("tr[id=ac_"+id+ ...

  9. 【jQuery】jQuery筛选器规则

    转载自:http://blog.csdn.net/lijinwei112/article/details/6938134 筛选器中加入变量 var ac = "select_" + ...

  10. jQuery中的选择器及筛选器

    1.jQuery的介绍 1.jQuery是继prototype之后又一个优秀的Javascript框架.其宗旨是--WRITE LESS,DO MORE! 2.它是轻量级的js库,这是其它的js库所不 ...

随机推荐

  1. 一个简单docker服务镜像的制作，手把手教你制作一个flask的docker容器服务镜像。

    OK,docker的安装就不多说了.(自己去搜吧) 下面开始讲如何制作镜像: 1.pull拉取一个centos镜像,随意拉取,可以是ubuntu sudo docker pull centos:7 2 ...

  2. 高效生产管理：选择顺通鞋业ERP系统派单的理由

    显然,传统的生产管理模式已经难以满足现代企业的需求,因此选择一款适合自身业务特点的生产管理软件成为了企业的当务之急.顺通鞋业ERP系统作为一款功能强大的生产管理软件,凭借其出色的派单功能,正逐渐成为众 ...

  3. opensips使用drouting进行路由

    操作系统 :CentOS 7.6_x64 opensips版本:2.4.9 drouting是Dynamic Routing(动态路由)的缩写,该模块可为特定呼叫选择(基于多个条件)最佳网关.今天整理 ...

  4. HL7消息类型

    HL7消息有很多不同的类型,每种都有其自己的独特用途和消息内容.以下是常见的HL7消息类型的列表. Message Type Description HL7 ADT Admit, Discharge ...

  5. MaxCompute 公共云多租户设计的技术要点详解及产品实现特色

    ​简介:公共云大数据平台在多租户的设计和实现方式上有所差异.本文主要介绍在公共云大数据平台的多租实现方案中需要考虑的问题和挑战,重点介绍了MaxCompute在计算和存储多租实现上的特点.期望通过这些 ...

  6. Let's Fluent：更顺滑的MyBatis

    简介: 只需瞅一眼Google Trends上全球Java界最热门的两款SQL映射框架近一年的对比数字,就不难了解其实力分布:在此领域,MyBatis早已占领东亚地区开发者市场,并以绝对优势稳居中国最 ...

  7. 【ESSD技术解读-01】 云原生时代，阿里云 ESSD 快照服务 助力企业级数据保护

    ​简介:本文以云原生为时代背景,介绍了阿里云块存储快照服务如何基于高性能 ESSD 云盘提升快照服务性能,提供轻量.实时的用户体验及揭秘背后的技术原理.依据行业发展及云上数据保护场景,为企业用户及备份 ...

  8. [Go] gorm 返回指定模型数据的处理方式

    重新 var 声明一个变量,类型为包含指定字段的结构体. 查询的时候,还是使用原始模型类型的变量. example: // For return data var retMember struct { ...

  9. [FAQ] JS 时间戳格式化为 date

    拷贝使用,不用引入第三方库 function formatDate (date = 0, fmt = 'yyyy-MM-dd hh:mm:ss') { date = new Date(+date) i ...

  10. 使用 NestJS 和 qrcode.js 创建 QR 码生成器 API

    前言 QR码(Quick Response Code)是一种二维码,于1994年开发.它能快速存储和识别数据,包含黑白方块图案,常用于扫描获取信息.QR码具有高容错性和快速读取的优点,广泛应用于广告. ...