Question

我目前正在访问DOM this small tutorial。在页面底部，创建一个函数来遍历DOM中的所有节点并获取下一个节点，这是一个很小的例外。我的代码工作正常，但我不确定它是如何工作的。这与DOM不太相关，而与if / while循环有关。

这是代码：

nextNode = function(node) {
    if (node.firstChild) {
        return node.firstChild;
    }

    while (node) {
        if (node.nextSibling) {
            return node.nextSibling;
        }
        node=node.parentNode;
    };
    return node;
};

我的问题是：

此功能的第一步是什么？例如，它首先检查是否存在所选节点的子节点。如果有，它会返回＆＃39;它。不应该这样结束这个功能吗？我认为回归是一种打破功能的方法吗？为什么会继续？
当它继续进入while循环时，会检查是否有下一个兄弟。它会回归＆＃39;这个也是。是什么让它回归？然后它跳转到父节点，然后再次检查。

我希望我的问题有道理。我只是想了解执行此功能时正在采取的步骤。

Answer 1

return可以正常工作 - 它完全终止了函数调用。您的函数所做的基本上是深度DOM树演练中的一个步骤：

检查节点是否有子节点，如果有，则返回它。如果没有，
检查节点是否具有以下兄弟节点，如果存在，则返回该节点。如果没有，
检查节点的父节点是否具有以下兄弟节点，如果存在则返回它（递归循环）。如果确实没有以下节点，
返回null，（因为只有在未定义while时才会退出node循环。）

Answer 2

此代码定义了稍后要调用的函数。该函数返回一个值。

这些if和while条件决定了返回的内容。

第一个if检查节点是否有子节点。如果是这样，它会返回它，在那里结束函数执行。

如果没有，脚本将继续while循环。

同样，如果节点有兄弟节点，则返回它，结束函数。只有在没有兄弟姐妹的情况下才会继续为父母。

当它完成遍历时，它会返回node的最终值中的任何内容。

Answer 3

您需要意识到此功能被设计为在循环中多次被调用。每次调用该函数时，它将只返回一次，具有一个节点值。在每次调用时，它可以通过函数遵循不同的路径。

例如，它首先检查是否存在所选节点的子节点。如果有，它会返回＆＃39;它。不应该结束这个功能吗？

结束函数，如果是子节点，因为return语句在if内。否则它将继续执行该功能的其余部分。无论哪种方式，它都将在后续函数调用中到达下一个节点。

当它继续到while循环时，它会检查是否有下一个兄弟。它会回归＆＃39;这个也是。是什么让它回归？

调用函数像往常一样，假设它没有通过返回函数顶部的if或while的前一次迭代中的值来结束调用。循环。

然后跳转到父节点，然后再次检查。

只有它还没有回来。

为什么不'return'在'if'语句中完全停止该函数？

3 个答案: