Oiioi Eric, tudo bem com você?
Muito bom! Seu código está de acordo com o código que o professor demonstrou na aula. O que está acontecendo é que ocorreu um erro de digitação da sua função document.querySelector
, em que foi digitado quarySelector
ao invés de querySelector
, o que fez com que seu código não conseguisse ser interpretado por seu programa. Deixo abaixo o comparativo das duas versões digitadas.
var input = document.querySelector("input");<!-- Digitação Correta -->
var input = document.quarySelector("input");<!-- Digitação Incorreta -->
Ainda assim você perceberá que o pop-up mostrado irá aparecer antes mesmo de você pressionar o botão. Isso acontece pois é necessário que você conecte a função de verificação que você escreveu, com o pressionar do botão, como mostrado no código abaixo:
<meta charset="UTF-8">
<input/>
<button>Compare com o meu segredo</button>
<script>
var segredo = 5;
var input = document.querySelector("input");
function verifica() {
if(input.value == segredo){
alert("Você Acertou!");
}else{
alert("Você Errou!");
}
}
var button = document.querySelector("button");
button.onclick = verifica;
</script>
Perceba que a função de verificação foi nomeada como verifica()
e ela se encontra sem os parênteses na linha do button.onclick
. Isso ocorre pois é necessário que você chame a função verificar só depois de pressionar o botão, visto que se você colocar os parênteses ela iria ser executada independente do botão ser pressionado ou não.
Dessa maneira, seu código vai conseguir entender a função querySelector
e também vai conseguir controlar a verificação para que ela fique dependente do pressionar do botão :)
Caso queira se aprofundar mais ainda sobre Lógica de Programação com Javascript e HTML, recomendo o curso Javascript e HTML: pratique lógica com desenhos, animações e um jogo. E se você tiver interesse de conhecer mais ainda sobre Javascript e HTML, recomendo as formações Javascript para Backend e HTML e CSS na alura!
Em caso de dúvidas, me coloco à disposição.
Grande abraço e bons estudos!
Caso este post tenha lhe ajudado, por favor, marcar como solucionado ✓. Bons Estudos!