- El problema original
En el código inicial, el botón "Nuevo Juego" siempre estaba activo. Eso causaba dos fallos:
- El jugador podía presionarlo sin haber terminado la partida.
- El removeAtribute tenía un error de sintaxis (faltaba una "t").
- La solución aplicada
Lo que hice fue manejar el estado del botón con los métodos de atributos en JavaScript:
a) El botón empieza deshabilitado
En el HTML lo dejé así:
button onclick="reiniciarJuego();" class="container__boton" id="reiniciar" disabled>
Nuevo Juego
==> Ese disabled hace que el botón no se pueda oprimir al inicio.
b) Cuando el jugador acierta el número secreto, lo activo
En la función verificarIntento():
if (numeroDeUsuario === numeroSecreto) {
asignarTextoElemento("p", Acertaste el número en ${intentos} ${(intentos === 1) ? 'intento' : 'intentos'} );
// Aquí habilito el botón
document.getElementById('reiniciar').removeAttribute('disabled');
}
==> removeAttribute('disabled') le quita el estado bloqueado al botón, y ahora sí se puede oprimir.
c) Cuando se presiona "Nuevo Juego", lo vuelvo a deshabilitar
En la función condicionesIniciales():
function condicionesIniciales() {
asignarTextoElemento('h1', 'Juego del número secreto');
asignarTextoElemento('p', 'Indica un número del 1 al 10');
numeroSecreto = generarNumeroSecreto();
intentos = 1;
// Lo vuelvo a deshabilitar
document.querySelector('#reiniciar').setAttribute('disabled', 'true');
}
De esa forma, el botón solo se habilita cuando el usuario acierta y vuelve a quedar bloqueado al reiniciar el juego.
