javascript - Check if elements (DOM Nodes) are siblings - Stack Overflow

admin管理员组

文章数量:1341749

How to check if two DOM elements are siblings?

Example DOM structure:

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

Test if <b> is a sibling of <a> but not of <i>

How to check if two DOM elements are siblings?

Example DOM structure:

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

Test if <b> is a sibling of <a> but not of <i>

• javascript
• jquery
• dom

Share Improve this question Follow edited Jun 20, 2020 at 9:12 CommunityBot 111 silver badge asked May 17, 2016 at 13:19 vsyncvsync 131k5959 gold badges340340 silver badges423423 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 15

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)

Vanilla:

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>

本文标签： javascriptCheck if elements (DOM Nodes) are siblingsStack Overflow