【问题标题】:Check if elements (DOM Nodes) are siblings检查元素(DOM 节点)是否是同级元素
【发布时间】:2016-05-17 13:19:28
【问题描述】:

如何检查两个 DOM 元素是否为兄弟?

示例 DOM 结构:

<div>
    <a></a>
    <b></b>
    <p></p>
</div>
<i></i>

测试&lt;b&gt; 是否是&lt;a&gt; 的兄弟,但不是&lt;i&gt; 的兄弟

【问题讨论】:

    标签: javascript jquery dom


    【解决方案1】:

    jQuery:

    var a = $('a'),
        b = $('b'),
        i = $('i');
    
    a.siblings().is(b); // true (since "b" is sibling of "a")
    a.siblings().is(i); // false (since "i" is sibling of "div" and not of "a")
    a.siblings().is(a); // false (can't be singling of itself)
    

    香草:

    const elm_p = document.querySelector('p');
    const elm_a = document.querySelector('a');
    const elm_i = document.querySelector('i');
    
    const areSiblings = (elm1, elm2) => 
      elm1 != elm2 && elm1.parentNode == elm2.parentNode;
    
    // tests
    [
      [elm_p, elm_a], // true
      [elm_a, elm_p], // true
      [elm_a, elm_a], // false
      [elm_a, elm_i]  // false
    ].forEach(([a,b]) => console.log(areSiblings(a,b)))
    <div>
        <a></a>
        <b></b>
        <p></p>
    </div>
    <i></i>

    【讨论】:

    • 你问这个问题知道答案吗?您可以更改问题以询问这种方式是否最好。
    • @BenG “你可以改变问题来询问这种方式是否最好。”你所说的“最好”是什么意思?
    • 最好的,正确的,无论如何。在你问这个问题的同一分钟。你把这个答案。在我看来你不是在问问题。我不明白其中的原因。
    • @BenG - 是的,在过去的 7 年里,我一直这样做,在 stackoverflow 中。我提出一个问题并写下答案,以便其他人在谷歌上寻求帮助时可以从中受益。用个人知识帮助社区非常重要。
    • @BenG “在我看来你不是在问问题。我不明白其中的原因”What is a canonical question/answer, and what is their purpose?
    猜你喜欢
    • 1970-01-01
    • 2018-11-27
    • 2022-06-21
    • 2011-06-13
    • 2011-04-14
    • 2011-04-16
    • 2018-07-09
    • 2013-11-09
    • 2011-03-25
    相关资源
    最近更新 更多