无法使用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() {

  console.log(links.indexOf(this))

}

Answer 2

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

Answer 3

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