javascript - 函数内调用的函数不起作用

Question

我将发布它，因为我找不到如何解决该问题的答案。

我有以下代码，可以更改某些 div 的背景颜色。 我有一个用于 changeSqColor() 的函数，在另一个函数中调用时该函数不起作用。 这里有什么问题？ (数组颜色已定义，元素数量 = div 数量)

var squares = document.getElementsByClassName("square");

function changeSqColor() {
    for (var i = 0; i < squares.length; i++) {
        squares[i].style.background = colors[i];
    }
}

changeSqColor(); // this works ok colors are changes

function resetGame() {
    //other commands
    changeSqColor(); //this one doesnt work, in console it says 'undefined'
}

Answer 1

有时您应该在代码中调用函数resetGame。您尚未调用 resetGame 。

var squares = document.getElementsByClassName("square");
let colors = ['red','green','blue','white','yellowgreen'];
function changeSqColor() {
  for (var i = 0; i < squares.length; i++) {
     squares[i].style.background = colors[i]; 
   }
setTimeout(function(){resetGame();},3000);// call resetGame Function.
}
changeSqColor(); 

function resetGame (){
 for (var i = 0; i < squares.length; i++) {
  squares[i].style.background = colors[0]; 
  }
  setTimeout(function(){changeSqColor();},3000);
  // As you mentioned calling changeSqColor() 
}

<div class="square">1</div>
<div class="square">2</div>
<div class="square">3</div>
<div class="square">4</div>
<div class="square">5</div>