javascript - 使用 jquery 查找两个元素之间的节点数？

Question

我在想出一种快速方法来完成(看似)简单的任务时遇到了一些困难。假设我有以下 html:

<ul>
  <li>One</li>
  <li>Two</li>
  <li id='parent'>
    <ul>
      <li>Three</li>
      <li>
        <ul>
          <li>Four</li>
          <li id='child'>Five</li>
        </ul>
      </li>
      <li>Six</li>
    </ul>
  </li>
</ul>

并且有以下两个元素:

var child = $("#child");
var parent = $("#parent");

在这个例子中，很明显:

child.parent().parent().parent().parent();

将与“父”节点相同。但是我正在遍历的列表是可变大小的，所以我需要找到一种方法来找出我需要经过多少个'.parent()'才能到达那个父节点。我总是知道 child 和 parent 在哪里，我只是不知道中间有多少“层”。

是否有任何内置的 jQuery 方法可以做这样的事情，或者我最好的选择是获取父节点的递归函数，检查父节点是否是我想要的节点，如果不是，则在其父节点上调用自身？

编辑:我可能解释得不够清楚。我的问题不是到达父节点，我的问题是找出子节点和父节点之间有多少个节点。在我上面的示例中，子节点和父节点之间有 3 个节点。这就是我需要查找的数据。

Answer 1

如果您只是想联系父级，请执行以下操作:

child.parents("#parent");

这比做起来容易:

child.parent().parent().parent();

或者您是否有其他原因需要知道该号码？

一个简单的循环就可以做到:

var node = child[0];
var depth = 0;
while (node.id != 'parent') {
  node = node.parentNode;
  depth++;
}