Gioco Cambio Colori su JavaScript

In questa sezione implementerete con il mio aiuto un gioco. Il gioco consisterà in una tabella, le cui celle sono colorate con colori casuali diversi.

Supponiamo ci sia un certo insieme di colori, ad esempio, rosso, verde, blu. Ogni click su una cella cambierà il suo colore in modo circolare. L'obiettivo del gioco è rendere la tabella di un unico - qualsiasi - colore con il minor numero di click.

Iniziamo l'implementazione. Per cominciare creiamo il campo di gioco sotto forma di tabella <table>:

<table id="field"></table>

Aggiungiamo un po' di codice CSS, per abbellire:

#field td {
	width: 50px;
	height: 50px;
	border: 1px solid black;
	text-align: center;
	font-weight: bold;
}

Discutiamo ora come affrontare l'implementazione del nostro gioco. Come potete vedere, questo compito è già abbastanza grande per essere risolto così su due piedi. Pertanto, dovrebbe essere scomposto in alcune fasi - sottoattività, eseguendo le quali gradualmente risolveremo il nostro compito principale.

Per iniziare, la fase più logica sarà scrivere uno script che crei le celle della tabella. Supponiamo, ad esempio, che la dimensione del campo di gioco sia memorizzata nelle seguenti variabili:

let rows = 3;
let cols = 3;

Copiate i codici HTML e CSS forniti. Scrivete il codice che creerà una tabella della dimensione data.