logo标签列表

如何使这个循环递归遍历所有子元素？

javascriptrecursionloopsfor-loopchildren
43

我有以下代码：

for (var i = 0; i < children.length; i++){
   if(hasClass(children[i], "lbExclude")){
       children[i].parentNode.removeChild(children[i]);
   }
};

我希望它可以遍历所有子孙节点（不仅仅是顶层节点）。我找到了这一行代码，它似乎可以做到：

for(var m = n.firstChild; m != null; m = m.nextSibling) {

但是如果我这样做，我不清楚如何引用当前子元素？我将不再有索引i来确定子元素的位置。有什么建议吗？

谢谢！

更新：

根据答案建议，我现在使用以下内容。这是正确/最有效的方法吗？

function removeTest(child) {
  if (hasClass(child, "lbExclude")) {
    child.parentNode.removeChild(child);
  }
}

function allDescendants(node) {
  for (var i = 0; i < node.childNodes.length; i++) {
    var child = node.childNodes[i];
    allDescendants(child);
    removeTest(child);
  }
}

var children = temp.childNodes;
for (var i = 0; i < children.length; i++) {
  allDescendants(children[i]);
};
你知道你在这里嵌套了多少个数组吗？ - thecoshman
只需使用m这个名称：m.parentNode.removeChild(m)。然而，可能会出现问题，因为在for循环中删除一个节点然后获取它的nextSibling将无法按预期工作。 - Dirk
@coshman，嵌套子元素的数量将是可变的。 - Matrym
@dirk，我没有想到那个。你有解决这个问题的建议吗？ - Matrym
11个回答
0
基本思路是记住DOM是一种树形结构。因此，使用递归方法，思路如下：
  1. 处理父对象；
  2. 如果对象有子元素（无论有多少个），使用childNodes函数迭代子元素；
  3. 在迭代中，递归调用相同的函数并传递子对象
例如：
function doSomething(obj) {
   // Processing parent obj here
   if(obj.childNodes !== undefined && obj.childNodes !== null) {
       obj.childNodes.forEach((c) => {
           doSomething(c)
       })
   }
}

请注意，在迭代中，doSomething 函数内的 'obj' 参数实际上是 'child' 对象。因此，您正在处理每个迭代的子节点，这意味着在循环结束和所有递归调用之后，此代码将处理从 'obj' 开始的树中的所有节点。
希望对您有所帮助！
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接