在我的示例中,我试图遍历HTML元素的集合,并检查它们是否与屏幕上的按钮单击匹配。但是循环似乎只检查第一个html元素,如果单击了另一个按钮,则不会再次运行该函数。

keyboard.onclick = function(event) {
  event.target.className += " chosen";
  let letterFound = event.target.innerHTML;
  checkLetter(letterFound);
}

const checkLetter = (a) => {
  let letterCheck = document.querySelectorAll('.letter');

  for (i = 0; i < letterCheck.length; i++) {
    if (a === letterCheck[i].innerHTML) {
      letterCheck[i].className += " show";
      let letterMatch = letterCheck[i];

      return letterMatch
    } else {
      return null;
    }
  }
}

最佳答案

我将使用es6中的过滤器功能来实现此目标,并以更实用的方法解决该问题。因此,如果您需要支持旧版浏览器,则可以使用babeljs来转译代码。如今,基本上没有什么可以阻止您使用新的js功能,因为使用babel,您可以转换所有内容。

const matchingLetters = document.querySelectorAll('.letter').filter(elem => elem.innerHtml === a);
// now you can use the filtered array to do something with your matchingLetters.
// e.g. use .map or do some loop etc.

关于javascript - JS for循环的问题,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/51595719/

10-11 05:45