<!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. 力扣1083(MySQL)-销售分析Ⅱ（简单）

    题目: 编写一个 SQL 查询,查询购买了 S8 手机却没有购买 iPhone 的买家.注意这里 S8 和 iPhone 是 Product 表中的产品. 查询结果格式如下图表示: Product t ...

  2. 力扣1069(MySQL)-产品分析Ⅱ（简单）

    题目: 编写一个 SQL 查询,按产品 id product_id 来统计每个产品的销售总量. 查询结果格式如下面例子所示:  解题思路: 没有用到product表,直接在sales表中使用聚合函数: ...

  3. 力扣344(java & python)-反转字符串（简单）

    题目: 编写一个函数,其作用是将输入的字符串反转过来.输入字符串以字符数组 s 的形式给出. 不要给另外的数组分配额外的空间,你必须原地修改输入数组.使用 O(1) 的额外空间解决这一问题. 示例 1 ...

  4. 阿里云架构师梁旭：MES on 云盒，助力客户快速构建数字工厂

    简介: 四大优势:一站式交付.业务低延时.数据本地驻留.多工厂统一运维 2022年5月18日,在"云上数字工厂与中小企业数字化转型创新论坛"暨"鼎捷MES & 阿 ...

  5. 云原生微服务的下一站，微服务引擎 MSE 重磅升级

    ​简介:管好微服务,成为云原生时代的新难题. 管好微服务,成为云原生时代的新难题. 从建好微服务到管好微服务,差的虽是一个字,连接起两边的却需要大量的微服务落地经验.因为软件架构的核心挑战是解决业务快 ...

  6. 阿里巴巴云原生大数据运维平台 SREWorks 正式开源

    ​简介:阿里巴巴云原生大数据运维平台 SREWorks,沉淀了团队近10年经过内部业务锤炼的 SRE 工程实践,今天正式对外开源,秉承"数据化.智能化"运维思想,帮助运维行业更多的 ...

  7. dotnet 在 UOS 国产系统上使用 MonoDevelop 进行拖控件开发 GTK 应用

    先从一个 Hello World 应用开始,试试和古老的 WinForms 一样的拖控件式开发 在创建完成一个 GTK# 2.0 应用之后,咱可以试试开始拖控件的开发,当然这个开发方式开发出来的应用界 ...

  8. dotnet build error CS5001: Program does not contain a static 'Main' method suitable for an entry point

    前言 Docker环境编译.Net6项目,出现诡异的CS5001 Program does not contain a static 'Main' method suitable for an ent ...

  9. 【zabbix】snmp监控linux主机

    1.安装net-snmp # yum install -y net-snmp 2.配置文件 /etc/snmp/snmpd.conf 添加如下内容 view systemview included . ...

  10. vue3.0 用vue ui　新建项目

    安装步骤: 1．打开安装界面 打开cmd vue ui 2.选择要安装的位置 3.设置详情 4.设置预设 5.设置功能 选择Babel / Router / Linter/Formatter / 使用 ...