首页 > 解决方案 > 如何从黑色和白色来回更改网格中框的颜色

问题描述

我有一个 5x5 的网格,到目前为止我能做的只是将一个盒子的颜色从白色变为黑色,但我每次点击盒子时都需要它在黑色和白色之间交替。

坦率地说,我很困惑,不知道如何让它交替我试图找到其他示例,但我找不到任何示例。目前以下 javascript 代码只能将框颜色从白色更改为黑色。

var grid = document.getElementsByClassName("box");

Array.from(grid).forEach(click => click.addEventListener("click", function() {v.style.background = "black";}));

标签: javascripthtml

解决方案


您可以在应用 css 样式之前添加一些条件检查。

var grid = document.getElementsByClassName("box");

Array.from(grid).forEach(click => click.addEventListener("click", function() {
    if (click.style.background === 'black') {
        click.style.background = "white";
    } else {
        click.style.background = "black";
    }
}));

推荐阅读