zoukankan      html  css  js  c++  java
  • 遍历DOM树,获取所有兄弟节点

    获取兄弟节点的常用方法有:

     方法  说明
    siblings()  选取所有兄弟节点
    next()  选取后面兄弟节点
    nextAll()  选取所有后面的兄弟节点
    nextUntil()  选取所有后面的兄弟节点,但不包含后面指定的节点及指定节点的弟弟……。
    prev()  选取前面的兄弟节点
    prevAll()  选取所有前面的兄弟节点
    prevUntil()  选取所有前面的兄弟节点,但不包含后面指定的节点及指定节点的哥哥……。

    获取所有兄弟节点

    使用方法siblings()

    示例:

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="UTF-8">
            <title>兄弟节点</title>
            <script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-3.3.1.min.js"></script>
            <style>
                .box{
                    border: 1px solid blueviolet;
                    padding: 1px;
                    margin-bottom: 12px;
                }
            </style>
        </head>
        <body>
            <div>
                <ul id="ul">
                    <li id="a">油条</li>
                    <li id="b">包子</li>
                    <li id="c">米饺</li>
                    <li id="d"><a>鱼粉</a></li>
                </ul>
            </div>
            <script>
                $('#c').siblings().attr("class", "box");
            </script>
        </body>
    </html>

    获取下个兄弟节点

    使用方法next()

    示例:

    1
    $('#c').next().attr("class", "box");

    获取所有后面的兄弟节点

    使用方法nextAll()

    示例:

    1
    $('#a').nextAll().attr("class", "box");

    获取所有前面的兄弟节点

    $('#a').prevAll().attr("class", "box");
    取所有后面的节点,但不包含其中的一个。
    $('#c').nextUntil().attr("class", "box");
  • 相关阅读:
    去除文件及子文件的隐藏和只读属性
    一个比较全的C++农历算法(转)
    Activity 的窗口去头的方式
    SQL查询显示行号、随机查询、取指定行数据
    C++中map用法详解(转)
    窗口消息大全(转)
    CTreeCtrl的用法汇总(转)
    CTreeView和CTreeCtrl的使用方法(转)
    用CImage加载内存里的Image(转)
    序列化编程,保存和读取配置文件
  • 原文地址:https://www.cnblogs.com/TangGe520/p/9131838.html
Copyright © 2011-2022 走看看