使用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()才能到达那个父节点.我总是知道孩子和父母在哪里,我只是不知道他们之间有多少'层'.

有没有内置的jQuery方法来做这样的事情,或者我最好的选择是获取父节点的递归函数,检查父节点是否是我想要的节点,如果没有调用它的父节点？

编辑:我可能没有足够清楚地解释自己.我的问题是没有得到父母,我的问题是找出孩子和父母之间有多少节点.在上面的示例中,child和parent之间有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++;
}