<!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. 顺通ERP：精细敏捷的设计理念，得到了消费者的喜爱

    顺通ERP是近年来备受关注的一款ERP品牌,其设计精细,操作便捷,备受消费者喜爱.那么,顺通ERP到底怎么样呢?属于什么档次呢? 首先,从品质上来看,顺通ERP具备高度的稳定性,能够确保企业的日常运营 ...

  2. vue3 快速入门系列 —— 其他API

    其他API 前面我们已经学习了 vue3 的一些基础知识,本篇将继续讲解一些常用的其他api,以及较完整的分析vue2 和 vue3 的改变. 浅层响应式数据 shallowRef shallow 中 ...

  3. 力扣219(java&python)-存在重复元素 II（简单）

    题目: 给你一个整数数组 nums 和一个整数 k ,判断数组中是否存在两个 不同的索引 i 和 j ,满足 nums[i] == nums[j] 且 abs(i - j) <= k .如果存在 ...

  4. 深度解读《深度探索C++对象模型》之C++虚函数实现分析（一）

    接下来我将持续更新"深度解读<深度探索C++对象模型>"系列,敬请期待,欢迎关注!也可以关注公众号:iShare爱分享,自动获得推文和全部的文章列表. 假如有这样的一段 ...

  5. MaxCompute项目子账号做超级管理员

    场景 主账号不是大数据团队管理,使用MaxCompute员工都只持有子账号,而project的owner只能为主账号,但是很多MaxCompute的权限管理还需要owner才可以操作(如项目级别的fl ...

  6. 更便捷：阿里云DCDN离线日志转存全新升级

    简介: 1月6日,阿里云CDN年度产品升级发布会中,阿里云CDN产品专家邓建伟宣布DCDN离线日志转存全新升级,并对离线日志转存方案的价值.应用及使用进行了详细解读. 在日常CDN加速服务过程中会产生 ...

  7. LogAgen的工作流程

    LogAgen的工作流程: 一.读日志 --tailf 第三方库 新建tail_test/main.go package main import ( "fmt" "git ...

  8. 显示器AVG、DVI、HDMI、DisplayPort、Type-C、雷电接口

    在近十年的发展,显示设备的接口发生了巨大的改变.以前使用比较多的是蓝色VGA接口,接著出现了白色的DVI接口,当遇到不同接口时,还得买转接头进行转接.后来,又有了HDMI等接口,现在则出现DP和USB ...

  9. C#.Net筑基-基础知识

    01.C#基础概念 1.1.C#简介 C# (读作C Sharp)是由微软公司开发的一种面向对象.类型安全.高效且简单的编程语言,最初于 2000 年发布,并随后成为 .NET 框架的一部分.所以学习 ...

  10. C语言：约瑟夫问题——使用循环链表解决

    传说有30个乘客同乘一条船,因为严重超载,加上风浪水作,危险万分.船长告诉乘客,只有将全船一半的乘客投入海 中,其余人才能幸免于难.他们约定了一个规则:30个人围成一圈,由第一个人数起,依次报数,数到 ...