递归记录 dom 中所有 children 的所有 children

Question

我试图在 DOM 中递归地获取所有 children。我看过其他一些例子，但它们对于我想要做的事情来说有点过分了。基本上我只想获取页面上节点的所有节点值，假设它们如下所示。

child
   child
       child
-------------------
child
    child
-------------------
child
-------------------
child
   child
      child
-------------------

我当前的代码如下，但它只挖取一层并假设 child 不会有另一个 X children。我不想继续做循环，所以我希望有人能给我介绍一个好的递归方法？

   //check all children inside a child
          for(let j = 0; j < children[i].length; j++){
              console.log(children[i][j])
                      }
                  }

Answer 1

document.querySelectorAll('body *') 应该 return 正文中的每个 DOM 元素，如果需要的话，将它们展平。

如果您正在寻找递归函数

var elements = [];
var recursiveFindChildren = function(el) {
  for (let i = 0, iLength = el.children.length; i<iLength; i++) {
    elements.push(el.children[i]);
    if (el.children[i].children.length) recursiveFindChildren(el.children[i]);
  }
  return elements;
}

recursiveFindChildren(document.body)

递归记录 dom 中所有 children 的所有 children

recursively log all children of all children in dom

javascript

arrays

nodevalue