DOM Question #4

Find all siblings of a given DOM element.

In this question we need to return all siblings so they can have same parent or different, but need to be on same level.

To solve this question BFS will be the most suitable algorithm. We will do level order traversal and return nodes at current level if targetNode exist.

function getSiblings = (targetNode )=> {
  if(!targetNode ) return null;

  const queue= [targetNode , null];
  let nodesAtSameLevel = [];
  let currentLevelIncludeTarget = false;

  while(queue.length > 0){
    const currentN = queue.shift();

    if(currentN === targetNode) currentLevelIncludeTarget = true;

    if(currentN === null){
      if(currentLevelIncludeTarget){
        return nodesAtSameLevel;
      }
      nodesAtSameLevel = [];
      if(queue.length) queue.push(null);
    } else {
      nodesAtSameLevel.push(currentN);
      queue.push(...currentN.childNodes);
    }
  }
  return [];
}

If we want to return only immediate siblings of given node we can get parentNode and then return all its child nodes after removing targetNode.

Something like

 const getSiblings = (node) => {
  if (!node || !node.parentNode) return [];

  return Array.from(node.parentNode.childNodes).filter((sibling) => sibling !== node);
};