javascript - 尝试创建一个简单的功能来更改页面背景颜色

如标题所述，我正在尝试创建一个实现该功能的函数。

这是我的JavaScript:

var clickCount = 0;
var colors = ["red", "blue", "green"];

function changBgColor(color) {
    var bodyTag = document.getElementsByTagName("body");
    bodyTag[0].style.backgroundColor = color;
}

function changeBg() {
    changeBgColor(colors[clickCount]);
    clickCount++;

    clickCount = clickCount % bgColors.length;
}

当从我的html调用函数changeBg()时，它什么也没有做，而我正试图理解原因。

最佳答案

您的代码中有一些错字。

var clickCount = 0;
var colors = ["red", "blue", "green"];

function changeBgColor(color) {
  var bodyTag = document.getElementsByTagName("body");
  bodyTag[0].style.backgroundColor = color;
}

function changeBg() {
  changeBgColor(colors[clickCount]);
  //---^------ missing e
  clickCount++;

  clickCount = clickCount % colors.length;
  // array variable name ---^^^^^^---

  // you can combine the above 2 lines if needed
  // clickCount = ++clickCount % colors.length;

  // or all 3 lines
  // changeBgColor(colors[ clickCount++ % colors.length]);

}

<button onclick="changeBg()">click</button>