Step 3
The style.css
is not of interest to us except to note we use CSS selectors x
and o
to style a cell which is marked by the cross or the naught marker. That is, when a cell is marked by a player, you must add the class name x
or o
to its class
attribute. Let's make a concrete example to better understand this.
- Open
index.html
in your favorite browser (Chrome is recommended). - Open the browser console (Developer Tools).
- Run the following command to mark the first cell with a cross:
let cell = document.getElementById("0"); cell.classList.add("x");
Exercise: mark the board's middle cell with a naught.
Solution
cell = document.getElementById("4");
cell.classList.add("o");