Recorrí los divs y agregué detectores de eventos a cada uno de ellos. Ahora estoy tratando de agregar una clase al div cuando se hace clic. Puedo agregar la clase con éxito si apunto el mosaico por ID, pero quiero agregar la clase al mosaico en el que se hace clic.
var gameBoard = document.getElementsByClassName("tile") var playerOne = { "turn": true, "class": "cross" } var playerTwo = { "turn": false, "class": "naught" } for (let i = 0; i < gameBoard.length; i++ ) { gameBoard[i].addEventListener("click", takeTurn) } function takeTurn () { this.classList.add(playerOne.class) }Si almaceno un mosaico en una variable usando getElementById, luego uso
tileOne.classList.add(playerOne.class)funciona bien. pero cada div en el que se hizo clic solo cambiaría la clase de los mosaicos y no el clic objetivo.
Todavía soy bastante nuevo en la programación, así que creo que me estoy perdiendo algo. ¿Alguien puede ayudar?
Cuando agrega un oyente, recibe datos de eventos como argumentos en la función llamada. Entonces, tienes que cambiar tu función takeTurn con:
function takeTurn (event) { event.target.classList.add(playerOne.class) }event.target selecciona el elemento que desencadena el evento.