Solution 1: DFS

To solve this problem, we can use a recursive depth-first traversal approach. The function getAllElements will start from the given root element and traverse each child node, collecting them in an array.

function getAllElements(root) {
    const result = [];

    function dfs(node) {
        result.push(node);
        for (let i = 0; i < node.childNodes.length; i++) {
            const child = node.childNodes[i];
            if (child.nodeType === 1) { // Only consider element nodes
                dfs(child);
            }
        }
    }

    // Start traversal from the root element
    dfs(root);

    return result;
}

// Example usage:
// Assuming the DOM structure from Example 1
document.addEventListener('DOMContentLoaded', () => {
  const rootElement = document.getElementById('root');
  console.log(getAllElements(rootElement));
});

Complexity

• Time complexity: O(N)
• Space complexity: O(N)

Solution 2: BFS

function getAllElements(root) {
  const result = [];
  if (!root) return result;
  
  const queue = [root];
  
  while (queue.length) {
    const node = queue.shift();
    result.push(node);
    for (const child of node.children) {
      queue.push(child);
    }
  }
  
  return result;
}

// Example usage:
// Assuming the DOM structure from Example 1
document.addEventListener('DOMContentLoaded', () => {
  const rootElement = document.getElementById('root');
  console.log(getAllElements(rootElement));
});

Complexity

• Time complexity: O(N)
• Space complexity: O(N)