zoukankan      html  css  js  c++  java
  • jquery的筛选器

    <!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>
    右侧打赏一下 代码改变世界一块二块也是爱
  • 相关阅读:
    linux下LD_PRELOAD的用处
    三个通用的脚本,处理MySQL WorkBench导出表的JSON数据进SQLITE3
    ubuntu 18.04下,KMS_6.9.1服务器启动后,客户端连接一段时间因为libnice而crash的问题修复
    Daliy Algorithm(线段树&组合数学) -- day 53
    Daliy Algorithm(链表&搜索&剪枝) -- day 52
    Daliy Algorithm(二分&前缀和) -- day 51
    每日算法
    动态规划--01背包模型
    每日算法
    每日算法
  • 原文地址:https://www.cnblogs.com/ht955/p/14110328.html
Copyright © 2011-2022 走看看