<!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. Causal Inference理论学习篇-Tree Based-Causal Forest

    广义随机森林 了解causal forest之前,需要先了解其forest实现的载体:GENERALIZED RANDOM FORESTS[6](GRF) 其是随机森林的一种推广, 经典的随机森林只能 ...

  2. Ubuntu下部署gitlab

    1.安装gitlab服务 1.安装依赖 在ubuntu下使用快捷键ctrl+alt+T打开命令行窗口,然后运行下面命令 sudo apt update sudo apt-get upgrade sud ...

  3. 深入理解MD5：Message Digest Algorithm 5

    title: 深入理解MD5:Message Digest Algorithm 5 date: 2024/4/21 18:10:18 updated: 2024/4/21 18:10:18 tags: ...

  4. 力扣661(java)-图片平滑器（简单）

    题目: 图像平滑器 是大小为 3 x 3 的过滤器,用于对图像的每个单元格平滑处理,平滑处理后单元格的值为该单元格的平均灰度. 每个单元格的  平均灰度 定义为:该单元格自身及其周围的 8 个单元格的 ...

  5. OpenYurt v1.1.0: 新增 DaemonSet 的 OTA 和 Auto 升级策略

    简介: 在 OpenYurt v1.1.0 版本中,我们提供了 Auto 和 OTA 的升级策略.Auto 的升级策略重点解决由于节点 NotReady 而导致 DaemonSet升级阻塞的问题,OT ...

  6. 5分钟入门Lindorm SearchIndex

    ​简介:SearchIndex是Lindorm宽表的二级索引,主要用来帮助业务实现快速的检索分析.本篇文章介绍如何通过简单的SQL接口操作SearchIndex. 一.引言 云原生多模数据库Lindo ...

  7. [PHP] Laravel 获取模型/表的所有字段

      获取指定表的所有字段名: use Illuminate\Support\Facades\Schema; // 表名不带前缀 $columns = Schema::getColumnListing( ...

  8. WPF 已知问题 InputEventArgs 的 Timestamp 属性是静态的导致事件之间相互影响

    本文记录一个 WPF 已知的设计问题,当前此问题已经被大佬修复,这个设计问题刚好属于比较边缘的模块,我写了这么多年的代码还没有踩到这个坑一次,也没有听到有谁提到这个坑 远古时候,不知道大佬是故意还是失 ...

  9. Python采集知网

    Python爬虫初探 selenium+beautifulsoup4+chromedriver 安装模块:* import pymssql* pip install bs4* pip install ...

  10. Visual Studio 2019 自带混淆工具DotFuscator不需要去网络下载

    http://t.zoukankan.com/daizhipeng-p-13492298.html 大家是否还在困扰发布的项目dll容易被人反编译呢,VS2019默认是没有安装DotFuscator的 ...