最新消息:Welcome to the puzzle paradise for programmers! Here, a well-designed puzzle awaits you. From code logic puzzles to algorithmic challenges, each level is closely centered on the programmer's expertise and skills. Whether you're a novice programmer or an experienced tech guru, you'll find your own challenges on this site. In the process of solving puzzles, you can not only exercise your thinking skills, but also deepen your understanding and application of programming knowledge. Come to start this puzzle journey full of wisdom and challenges, with many programmers to compete with each other and show your programming wisdom! Translated with DeepL.com (free version)

javascript - How do I remove siblings from the DOM? - Stack Overflow

matteradmin2PV0评论

I have this working code:

  a.parentNode.removeChild(a);

I need to also remove this child's previous sibling, i.e. the element that es before it.

How do I update this? Does MDN have documentation on it?

I have this working code:

  a.parentNode.removeChild(a);

I need to also remove this child's previous sibling, i.e. the element that es before it.

How do I update this? Does MDN have documentation on it?

Share Improve this question edited Sep 1, 2016 at 22:51 Piper 1,2753 gold badges15 silver badges26 bronze badges asked Aug 28, 2011 at 22:23 user656925user656925 10
  • 3 a.parentNode.removeChild( a.previousSibling ); – Šime Vidas Commented Aug 28, 2011 at 22:25
  • developer.mozilla/En/DOM/Node.previousSibling – mVChr Commented Aug 28, 2011 at 22:27
  • thank you , do people have these things memorized or do you reference it somewhere, getting tired of googling everything and finding it on random web-sites. thanks again – user656925 Commented Aug 28, 2011 at 22:27
  • Btw are you sure that the previous node is an element node? It could be a text node... – Šime Vidas Commented Aug 28, 2011 at 22:27
  • For future reference: The DOM reference, more specifically, the Node interface. – Felix Kling Commented Aug 28, 2011 at 22:27
 |  Show 5 more ments

3 Answers 3

Reset to default 9

Ok, here is a solution which takes into account that the previous sibling might not be an element node:

var previous = a.previousSibling;

// iterate until we find an element node or there is no previous sibling
while(previous && previous.nodeType !== 1) {
    previous = previous.previousSibling;
}

// if there is a sibling, remove it
if(previous) {
    previous.parentNode.removeChild(previous);
}

Reference: Node.previousSibling [MDN]

You could easily create a function which gives you the previous element node.

I will repeat my ment here:

You can find a reference of all DOM interfaces at MDN, in particular, the Node interface.

  /**
   * Removes all sibling elements after specified
   * @param {HTMLElement} currentElement
   * @private
   */
  _removeNextSiblings(currentElement) {
    while (!!currentElement.nextElementSibling) {
      currentElement.nextElementSibling.remove();
    }
  }

The following code is to remove all sibling elements except for .me

const node = document.querySelector('.me');
const clone = node.cloneNode(true);

const parentNode = node.parentNode;
parentNode.innerHTML = '';
parentNode.append(clone);
Post a comment

comment list (0)

  1. No comments so far