function getChildIndex(node) {
  return Array.prototype.indexOf.call(node.parentNode.childNodes, node);
}

这似乎适用于 Opera 11、Firefox 4、Chromium 10。其他浏览器未经测试。如果节点没有父节点，它将抛出 TypeError （node.parentNode !== undefined如果您关心这种情况，请添加检查）。

当然，Array.prototype.indexOfdoes 仍然循环，只是在函数调用中。没有循环就不可能做到这一点。

注意：如果要获取子节点的索引Element，可以将上面的函数修改childNodes为children。

function getChildElementIndex(node) {
  return Array.prototype.indexOf.call(node.parentNode.children, node);
}

您可以计算兄弟姐妹... childNodes 列表包括文本和元素节点-

function whichChild(elem){
    var  i= 0;
    while((elem=elem.previousSibling)!=null) ++i;
    return i;
}

选项1

您可以使用该Array.from()方法将一个HTMLCollectionof 元素转换为一个数组。从那里，您可以使用本机.indexOf()方法来获取索引：

function getElementIndex (element) {
  return Array.from(element.parentNode.children).indexOf(element);
}

如果您想要节点索引（与元素索引相反），则将children属性替换为childNodes属性：

function getNodeIndex (element) {
  return Array.from(element.parentNode.childNodes).indexOf(element);
}

选项#2

您可以使用该.call()方法来调用数组类型的本机.indexOf()方法。如果您查看源代码，这就是该.index()方法在 jQuery 中的实现方式。

function getElementIndex(element) {
  return [].indexOf.call(element.parentNode.children, element);
}

同样，使用childNodes属性代替children属性：

function getNodeIndex (element) {
  return [].indexOf.call(element.parentNode.childNodes, element);
}

选项#3

您还可以使用扩展运算符：

function getElementIndex (element) {
  return [...element.parentNode.children].indexOf(element);
}

function getNodeIndex (element) {
  return [...element.parentNode.childNodes].indexOf(element);
}

如果不以某种方式循环，则无法在其父节点中获取节点的索引，无论是 - 循环，还是像or 之类for的Array方法，或其他方式。DOM 中的索引操作是线性时间的，而不是恒定时间的。indexOfforEach

更一般地说，如果列表突变是可能的（并且 DOM 肯定支持突变），则通常不可能提供以恒定时间运行的索引操作。有两种常见的实现策略：链表（通常是双重的）和数组。使用链表查找索引需要走一段路。使用数组查找索引需要扫描。一些引擎会缓存索引以减少计算所需的时间node.childNodes[i]，但是如果您正在搜索节点，这对您没有帮助。不问问题是最好的策略。

我想你已经明白了，但是：

• 确保变量“i”声明为 var
• 在比较中使用===而不是==