Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

Outra resolução

Fiz diferente doque mostrado na aula, e está funcionando normalmente, é válido?

HTML, alterei o nome para "container_botao" e adicionei o atributo disabled

<button onclick="reiniciar()" id="btn-reiniciar" class="container__botao" disabled>Reiniciar</button>

e no JavaScript, dentro da função sortear:

document.getElementById('btn-reiniciar').removeAttribute('disabled');

com isso não precisa usar aquele código do CSS, e depois é só adicionar na função reiniciar o atributo disabled novamente com:

document.getElementById('reiniciar').setAttribute('disabled', true);
1 resposta
solução!

Oii Isac, tudo bem?

Sim, é totalmente válido! No mundo da programação, raramente existe apenas um caminho correto para resolver um problema.

O que você fez foi utilizar o comportamento nativo do HTML através do atributo disabled. Essa é uma abordagem muito limpa e profissional, pois o próprio navegador já entende que aquele botão não deve disparar eventos enquanto estiver desativado.

Qual a diferença entre a sua solução e a da aula?

O foco ali foi didático, para ensinar como manipular o CSS via JavaScript (classList.add e remove). É uma técnica visualmente poderosa, mas que exige que você gerencie o "bloqueio" do clique manualmente ou via CSS (pointer-events: none).

Você mexeu no estado do elemento. Quando você usa setAttribute('disabled', true), o botão fica inacessível por padrão para o usuário.

No seu exemplo, você mencionou document.getElementById('reiniciar'), mas lembre-se que no HTML o ID é btn-reiniciar. Mantenha sempre os nomes iguais para não dar erro no console, beleza?

Parabéns por buscar alternativas e questionar o código! É assim que a gente evolui como pessoa desenvolvedora.

Bons estudos!

Sucesso

Imagem da comunidade