【JavaScript算法】DOM树层级显示

Zhou YiHang

于 2024-03-29 22:04:18 发布

阅读量280

点赞数 3

文章标签： javascript 开发语言 ecmascript

本文链接：https://blog.csdn.net/z914020826/article/details/137157545

版权

题目描述：
在这里插入图片描述

上述表达式的输出结果为
['DIV']
['P', 'SPAN', 'P', 'SPAN']
['SPAN', 'SPAN']

直接上代码

let tree = document.querySelector(".a");
function traverseElRoot(elRoot) {
  const result = [];
  function traverse(element, level) {
    if (!result[level]) {
      result[level] = [];
    }
    result[level].push(element.tagName);
    Array.from(element.children).forEach((child) => {
      traverse(child, level + 1);
    });
  }
  traverse(elRoot, 0);
  return result;
}
console.log(traverseElRoot(tree));