javascript - 查找元素在其兄弟元素中的位置

Question

我想要一个函数来告诉我该元素相对于其他每个元素的位置。

function Funk(x) {
  var y = //how many elements are infront of it in its parent.
  console.log(y)
}

<ul>
  <li onclick='Funk(this)'>1</li>
  <li onclick='Funk(this)'>2</li>
  <li onclick='Funk(this)'>3</li>
  <li onclick='Funk(this)'>4</li>
</ul>  

在此示例中，我希望输出是我单击的任何数字。因此，如果我单击第三个元素，它会输出 3。

Answer 1

您可以使用 parentNode 和 children 在 DOM 中上下移动。

function Funk(x) {
  var y = 0;
  var children = x.parentNode.children;
  while (children[y] !== x) y++;
  y++;
  console.log(y)
}

<ul>
  <li onclick='Funk(this)'>1</li>
  <li onclick='Funk(this)'>2</li>
  <li onclick='Funk(this)'>3</li>
  <li onclick='Funk(this)'>4</li>
</ul>