zoukankan      html  css  js  c++  java
  • JQuery选择兄弟元素

    原帖地址:https://www.jb51.net/article/50342.htm

    获取指定元素的兄弟元素时,可以使用adjacent sibling combinator (+),其中+的两侧内容都是selector expression.

    如果要获取下例中所有的 h1的直接兄弟元素h2
    复制代码代码如下:

    <div>
    <h1>Main title</h1>
    <h2>Section title</h2>
    <p>Some content...</p>
    <h2>Section title</h2>
    <p>More content...</p>
    </div>

    可以直接使用
    复制代码代码如下:

    $('h1 + h2')
    // Select ALL h2 elements that are adjacent siblings of H1 elements.

    如果要过滤h1的兄弟元素,当然也可以使用
    复制代码代码如下:

    $('h1').siblings('h2,h3,p');
    // Select all H2, H3, and P elements that are siblings of H1 elements.

    如果要获取当前元素之后的所有兄弟元素,可以使用nextAll()
    例如,针对下面的html代码
    复制代码代码如下:

    <ul>
    <li>First item</li>
    <li class="selected">Second Item</li>
    <li>Third item</li>
    <li>Fourth item</li>
    <li>Fifth item</li>
    </ul>

    如果要获取第二个条目之后的所有li元素,可以使用如下代码
    复制代码代码如下:

    $('li.selected').nextAll('li');

    上例也可以使用general sibling combinator (~)来实现
    复制代码代码如下:

    $('li.selected ~ li');

    获取直接兄弟元素也可以不使用selector,直接使用next().
    复制代码代码如下:

    var topHeaders = $('h1');
    topHeaders.next('h2').css('margin', '0);
  • 相关阅读:
    Mac查看某个文件的中某关键字信息
    Mac查看所有的文件
    Mac查看当前用户的环境变量
    Mac安装maven
    Lombok使用坑之属性不区分大小写
    Mac常用软件列表
    Mac系统升级
    Mac安装Git
    Mac查看git的安装路径
    Mac安装JDK8
  • 原文地址:https://www.cnblogs.com/hsRick/p/11529213.html
Copyright © 2011-2022 走看看