JavaScriptでの色変えゲーム
このセクションでは、私の助けを借りてゲームを実装します。 ゲームは、さまざまなランダムな色で塗られたセルを持つ テーブルになります。
例えば、赤、緑、青といった特定の色のセットがあるとします。 セルをクリックするたびに、その色を順に変更します。 ゲームの目的は、最小のクリック数でテーブルを 単一の色(どの色でも可)にすることです。
実装に取り掛かりましょう。まず、ゲームボードとして
テーブル <table> を作成します:
<table id="field"></table>
見た目を整えるために、いくつかのCSSコードを追加します:
#field td {
width: 50px;
height: 50px;
border: 1px solid black;
text-align: center;
font-weight: bold;
}
さて、ゲームの実装へのアプローチ方法について議論しましょう。 ご覧の通り、このタスクは十分に大きく、いきなり解決するのは 難しいです。したがって、いくつかの段階(サブタスク)に分割し、 それらを実行することで徐々にメインのタスクを解決する必要があります。
まず最初の最も論理的な段階は、テーブルのセルを作成する スクリプトを書くことです。 例えば、ゲームボードのサイズを以下の変数に格納するとします:
let rows = 3;
let cols = 3;
提示されたHTMLとCSSコードを自身の環境にコピーしてください。 指定されたサイズのテーブルを作成するコードを記述してください。