无法使用javascript获取数组中当前单击元素的索引

Question

这是我的 HTML 代码

var link = document.getElementsByClassName("link");

for (i = 0; i < link.length; i++) {

  link[i].addEventListener("click", click);

  function click() {

    console.log(link.indexOf(this));

  }

}

<div class="links">

  <ul>

    <li>

      <div class="hole-counter"><span></span></div><a class="link">Home</a>

    </li>

    <li>

      <div class="hole-counter"><span></span></div><a class="link">About</a>

    </li>

    <li>

      <div class="hole-counter"><span></span></div><a class="link">Gallery</a>

    </li>

    <li>

      <div class="hole-counter"><span></span></div><a class="link">Contact</a>

    </li>

  </ul>

</div>

这是 javascript 代码

我在控制台中收到此错误 Uncaught TypeError: link.indexOf is not a function at HTMLAnchorElement.click (index.html:97)

Answer 1

你代码中的链接变量是HTMLCollection，使用前需要将其转换为数组 indexOf你可以这样做const links = [...document.getElementsByClassName("link")];links.forEach(link => link.addEventListener("click", click));function click() {&nbsp; console.log(links.indexOf(this))}

Answer 2

您的链接变量不是数组，因此您不能对其调用 indexOf()。您必须首先将链接转换为数组。&nbsp;var link = Array.from(document.getElementsByClassName("link"));

Answer 3

您的链接变量只是一个变量，而 indexOf 函数专门用于数组。因此，您应该首先将变量转换为数组。您可以通过将其声明为数组或之后将其转换为数组来实现。