In this section, you will implement a game with my help. The game will be a table whose cells are colored in different random colors.
Let there be a certain set of colors, for example, red, green, blue. Let each click on a cell change its color in a circle. The goal of the game is to make a table of one - any - color in the least number of clicks.
Let's get started with the implementation. First,
let's make the playing field in the form of a
table <table>
:
<table id="field"></table>
Let's add some CSS code to bring some beauty:
#field td {
width: 50px;
height: 50px;
border: 1px solid black;
text-align: center;
font-weight: bold;
}
Let's now discuss how to approach the implementation of our game. As you can see, this task is large enough to solve it right off the bat. Therefore, it should be divided into some stages - subtasks, by performing which we will gradually solve our main task.
To begin with, the most logical step would be to write a script that creates table cells. Let, for example, the size of the playing field be stored in the following variables:
let rows = 3;
let cols = 3;
Copy the provided HTML and CSS codes. Write code that creates a table of the given size.