获取子节点索引ES6：

javascript dom

2022-08-30 01:52:16

在直截了当的javascript中（即，没有扩展，如jQuery等），有没有办法确定子节点在其父节点内的索引，而无需迭代和比较所有子节点？

例如，

var child = document.getElementById('my_element');
var parent = child.parentNode;
var childNodes = parent.childNodes;
var count = childNodes.length;
var child_index;
for (var i = 0; i < count; ++i) {
  if (child === childNodes[i]) {
    child_index = i;
    break;
  }
}

有没有更好的方法来确定孩子的指数？

答案 1

我已经喜欢用它来了。因为 is on 并且是一个，你必须使用它有点丑陋，但它是一个单行，并且使用任何 javascript 开发人员都应该熟悉的函数。indexOfindexOfArray.prototypeparent.childrenNodeListcall();

var child = document.getElementById('my_element');
var parent = child.parentNode;
// The equivalent of parent.children.indexOf(child)
var index = Array.prototype.indexOf.call(parent.children, child);

答案 2

ES6：

Array.from(element.parentNode.children).indexOf(element)

解释：

element.parentNode.children→ 返回的兄弟，包括该元素。element
Array.from→ 将的构造函数强制转换为对象childrenArray
indexOf→ 您可以申请，因为您现在有一个对象。indexOfArray