zoukankan      html  css  js  c++  java
  • jQuery 练习[二]: 获取对象(2) 定位子对象


    选择中的特殊符号:
    #    指示 id
    .    指示 class
    *    全选
    ,    多选
    空格 后代
    >    子
    ~    兄弟
    +    下一个
    :    子(多功能)
    ()   函数式的过滤与查找
    

    获取 div 下的所有标题对象: $("div :header")
    <body>
        <h3>AAA</h3>

        <p>BBB</p>

        <h4>CCC</h4>

        <div>

            <h3>DDD</h3>
            <p>EEE</p>

            <h4>FFF</h4>
        </div>

    </body>

    获取所有标题对象: $(":header")
    <body>
        <h3>AAA</h3>
        <p>BBB</p>

        <h4>CCC</h4>
        <div>

            <h3>DDD</h3>
            <p>EEE</p>

            <h4>FFF</h4>
        </div>

    </body>

    获取 first, 如: $("li:first") 或 $("li").first() 或 $("ul :first") 或 $("ul li:first")
    <ul>
        <li>AAA</li>
        <li>BBB</li>
        <li>CCC</li>
        <li>DDD</li>
        <li>EEE</li>
        <li>FFF</li>
        <li>GGG</li>
    </ul>
    <ul>
        <li>111</li>
    </ul>
    <ul>
        <li>XXX</li>
        <li>YYY</li>
        <li>ZZZ</li>
    </ul>

    获取每组的 first, 如: $("li:first-child") 或 $("ul li:first-child") 或 $("ul :first-child")
    <ul>
        <li>AAA</li>
        <li>BBB</li>
        <li>CCC</li>
        <li>DDD</li>
        <li>EEE</li>
        <li>FFF</li>
        <li>GGG</li>
    </ul>
    <ul>
        <li>111</li>
    </ul>
    <ul>
        <li>XXX</li>
        <li>YYY</li>
        <li>ZZZ</li>
    </ul>

    获取 last, 如: $("li:last") 或 $("li").last() 或 $("ul :last") 或 $("ul li:last")
    <ul>
        <li>AAA</li>
        <li>BBB</li>
        <li>CCC</li>
        <li>DDD</li>
        <li>EEE</li>
        <li>FFF</li>
        <li>GGG</li>
    </ul>
    <ul>
        <li>111</li>
    </ul>
    <ul>
        <li>XXX</li>
        <li>YYY</li>
        <li>ZZZ</li>
    </ul>

    获取每组的 last, 如: $("li:last-child") 或 $("ul li:last-child") 或 $("ul :last-child")
    <ul>
        <li>AAA</li>
        <li>BBB</li>
        <li>CCC</li>
        <li>DDD</li>
        <li>EEE</li>
        <li>FFF</li>
        <li>GGG</li>
    </ul>
    <ul>
        <li>111</li>
    </ul>
    <ul>
        <li>XXX</li>
        <li>YYY</li>
        <li>ZZZ</li>
    </ul>

    获取第几个, 如(获取第三个, eq 是 0 起): $("li:eq(2)") 或 $("li").eq(2)
    <ul>
        <li>AAA</li>
        <li>BBB</li>
        <li>CCC</li>
        <li>DDD</li>
        <li>EEE</li>
        <li>FFF</li>
        <li>GGG</li>
    </ul>
    <ul>
        <li>111</li>
    </ul>
    <ul>
        <li>XXX</li>
        <li>YYY</li>
        <li>ZZZ</li>
    </ul>

    获取第几个之后的, 如(获取第三个之后的, gt 是 0 起): $("li:gt(2)")
    <ul>
        <li>AAA</li>
        <li>BBB</li>
        <li>CCC</li>
        <li>DDD</li>
        <li>EEE</li>
        <li>FFF</li>
        <li>GGG</li>

    </ul>
    <ul>
        <li>111</li>
    </ul>
    <ul>
        <li>XXX</li>
        <li>YYY</li>
        <li>ZZZ</li>

    </ul>

    获取第几个之前的, 如(获取第三个之前的, lt 是 0 起): $("li:lt(2)")
    <ul>
        <li>AAA</li>
        <li>BBB</li>

        <li>CCC</li>
        <li>DDD</li>
        <li>EEE</li>
        <li>FFF</li>
        <li>GGG</li>
    </ul>
    <ul>
        <li>111</li>
    </ul>
    <ul>
        <li>XXX</li>
        <li>YYY</li>
        <li>ZZZ</li>
    </ul>

    获取索引值是偶数的, 如(even 是 0 起): $("li:even")
    <ul>
        <li>AAA</li>
        <li>BBB</li>
        <li>CCC</li>
        <li>DDD</li>
        <li>EEE</li>
        <li>FFF</li>
        <li>GGG</li>
    </ul>
    <ul>
        <li>111</li>
    </ul>
    <ul>
        <li>XXX</li>
        <li>YYY</li>
        <li>ZZZ</li>
    </ul>

    获取索引值是奇数的, 如(odd 是 0 起): $("li:odd")
    <ul>
        <li>AAA</li>
        <li>BBB</li>
        <li>CCC</li>
        <li>DDD</li>
        <li>EEE</li>
        <li>FFF</li>
        <li>GGG</li>
    </ul>
    <ul>
        <li>111</li>
    </ul>
    <ul>
        <li>XXX</li>
        <li>YYY</li>
        <li>ZZZ</li>
    </ul>

    获取每组第偶数个, 如(nth-child 是 1 起): $("li:nth-child(even)")
    <ul>
        <li>AAA</li>
        <li>BBB</li>
        <li>CCC</li>
        <li>DDD</li>
        <li>EEE</li>
        <li>FFF</li>
        <li>GGG</li>
    </ul>
    <ul>
        <li>111</li>
    </ul>
    <ul>
        <li>XXX</li>
        <li>YYY</li>
        <li>ZZZ</li>
    </ul>

    获取每组第奇数个, 如(nth-child 是 1 起): $("li:nth-child(odd)")
    <ul>
        <li>AAA</li>
        <li>BBB</li>
        <li>CCC</li>
        <li>DDD</li>
        <li>EEE</li>
        <li>FFF</li>
        <li>GGG</li>
    </ul>
    <ul>
        <li>111</li>
    </ul>
    <ul>
        <li>XXX</li>
        <li>YYY</li>
        <li>ZZZ</li>
    </ul>

    获取每组第几个, 譬如第 2 个(nth-child 是 1 起): $("li:nth-child(2)")
    <ul>
        <li>AAA</li>
        <li>BBB</li>
        <li>CCC</li>
        <li>DDD</li>
        <li>EEE</li>
        <li>FFF</li>
        <li>GGG</li>
    </ul>
    <ul>
        <li>111</li>
    </ul>
    <ul>
        <li>XXX</li>
        <li>YYY</li>
        <li>ZZZ</li>
    </ul>

    用表达式指示每组的第几个, 如(nth-child 是 1 起): $("li:nth-child(3n-1)")
    <ul>
        <li>AAA</li>
        <li>BBB</li>
        <li>CCC</li>
        <li>DDD</li>
        <li>EEE</li>
        <li>FFF</li>
        <li>GGG</li>
    </ul>
    <ul>
        <li>111</li>
    </ul>
    <ul>
        <li>XXX</li>
        <li>YYY</li>
        <li>ZZZ</li>
    </ul>

    如果是父元素中唯一的子元素, 如: $("li:only-child")
    <ul>
        <li>AAA</li>
        <li>BBB</li>
        <li>CCC</li>
        <li>DDD</li>
        <li>EEE</li>
        <li>FFF</li>
        <li>GGG</li>
    </ul>
    <ul>
        <li>111</li>
    </ul>
    <ul>
        <li>XXX</li>
        <li>YYY</li>
        <li>ZZZ</li>
    </ul>

    :not 是对其他选择的取反, 如: $("li:not(li:first-child)")
    <ul>
        <li>AAA</li>
        <li>BBB</li>
        <li>CCC</li>
        <li>DDD</li>
        <li>EEE</li>
        <li>FFF</li>
        <li>GGG</li>

    </ul>
    <ul>
        <li>111</li>
    </ul>
    <ul>
        <li>XXX</li>
        <li>YYY</li>
        <li>ZZZ</li>

    </ul>



  • 相关阅读:
    python字典
    python中List添加、删除元素的几种方法
    python数据处理之基本函数
    python批量处理
    python正则表达式
    python模块学习:os模块
    Hough transform(霍夫变换)
    MODBUS TCP/IP协议规范详细介绍
    Linux下run文件的直接运行
    双边滤波和引导滤波的原理
  • 原文地址:https://www.cnblogs.com/del/p/1746011.html
Copyright © 2011-2022 走看看