Hra změna barev v JavaScriptu

V této sekci s mou pomocí implementujete hru. Hra bude představovat tabulku, jejíž buňky jsou obarveny různými náhodnými barvami.

Nechť existuje určitý soubor barev, například, červená, zelená, modrá. Nechť každé kliknutí na buňku mění její barvu v kruhu. Cíl hry - za nejmenší počet kliknutí udělat tabulku jedné - libovolné - barvy.

Pojďme se pustit do implementace. Pro začátek uděláme herní pole ve formě tabulky <table>:

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

Přidejme nějaký CSS kód, který dodá krásu:

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

Pojďme nyní probrat, jak přistoupit k implementaci naší hry. Jak vidíte, tento úkol je již dostatečně velký, aby byl vyřešen ihned. Proto by měl být rozdělen na některé etapy - podúkoly, jejichž plněním postupně vyřešíme náš hlavní úkol.

Nejprve nejlogičtější etapou bude napsat skript, který vytvoří buňky tabulky. Nechť, kupříkladu, velikost herního pole je uložena v následujících proměnných:

let rows = 3;
let cols = 3;

Zkopírujte si uvedené HTML a CSS kódy. Napište kód, který vytvoří tabulku dané velikosti.