não funciona, alguém pode explicar | JavaScript e HTML: desenvolva um jogo e pratique lógica de programação

boa tarde, gostaria de saber porque meu código não funciona quando clico no botão... e aceito sugestões :)

e também aparece um erro: unexpected end of input

<meta charset="UTF-8">
<h1>Jogo de adivinhaçao!</h1>
<input/>
<button>chutar</button>

<script>


var numeroPensado = Math.round(Math.random() * 10);
      var inputValor = document.querySelector("input");
    input.focus();


    function verifica() {
for(var tentativas = 1; tentativas <=3; tentativas++) {


    if(input.value == numeroPensado) {

     alert("Você ACERTOU!, o número pensado era " + numeroPensado);


    }else {

     alert("Você ERROU!");
     }

      input.value = "";
           input.focus();

     }
          var botao = document.querySelector("button"); //
     button.onclick = verifica;





</script>

A primeira dica que eu dou a quem está começando a programar é: organize seu código! Parece bobagem, mas não é. A maior vítima de um código desarrumado é você mesma, que vai chegar lá depois de amanhã e não vai entender absolutamente nada! :)

E, pra organizar, o primeiro passo é a indentação. Palavra bonita pra uma coisa bem simples: os espaços antes das linhas! Quando temos itens dentro de chaves (que representam laços for, condições if, funções etc), eles devem ir "andando pra direita" no código. Veja um exemplo (que não tem nada a ver com o código original, é só exemplo mesmo):

function contaPares(maximo) {
    var result = 0;
    for (var contador = 1; contador <= maximo; contador++) {
        if (!(contador % 2)) {
            result++;
        }
    }
    return result;
}

Viu? O que tem dentro da função está 4 espaços mais pra dentro do que a declaração da função. Da mesma forma, o que está dentro do for e o que está dentro do if. Isso facilita saber o que está dentro de cada bloco. O padrão é usar 2 ou 4 espaços, nunca tab, tá? :)

Mas agora a estrutura do código. Aí a gente vai falar sobre variáveis. Você declarou uma variável chamada inputValor pra que ela representasse o input. Então, é através dela que você irá acessá-lo. Então a gente precisa mudar de cara isso daqui:

var inputValor = document.querySelector("input");
input.focus();

pra isso:

var input = document.querySelector("input");
input.focus();

Optei por chamar ela só de input mas esse é o nome da variável, tá? Eu poderia chamar ela de inputValor, mas aí eu ia ter que mudar no código todo.

Depois, eu alterei a função verifica pra tirar o número de tentativas, pra facilitar. Se você precisar, a gente pensa numa forma de avisar o usuário que as três tentativas já acabaram, mas não do jeito que o código estava estruturado. Isso não ia ficar bom.

O restante está tudo certinho. O que faltou foi exatamente fechar a chave da função, o que você teria percebido facilmente, se o código já estivesse identado (de novo essa palavra! Ela é realmente bem útil!)

Então, o código todo fica assim, ó:

<meta charset="UTF-8">
<h1>Jogo de adivinhaçao!</h1>
<input/>
<button>chutar</button>

<script>

    var numeroPensado = Math.round(Math.random() * 10);
    var input = document.querySelector("input");
    input.focus();

    function verifica() {

        if(input.value == numeroPensado) {
            alert("Você ACERTOU!, o número pensado era " + numeroPensado);
        }else {
            alert("Você ERROU!");
        }

        input.value = "";
        input.focus();
    }

    var botao = document.querySelector("button"); //
    botao.onclick = verifica;

</script>

Nas útimas linhas eu precisei mudar o nome de uma variável de novo, porque você declarou assim:

var botao = document.querySelector("button");

e tentou acessar o elemento assim:

button.onclick = verifica;

Talvez você esteja se confundindo em relação ao que colocar antes do .onclick. Mas, nesse caso, é a variável que representa o botão, que se chama botao e não button (que é o tipo do componente HTML que vai ser apertado).

Queria só aproveitar pra lembrar que esse HTML está incompleto, tá? Ele funciona porque os navegadores (Firefox, Chrome, Opera) são bem permissivos e não travam a página quando falta alguma coisa, mas, a priori, era bom ter a estrutura mínima HTML que é a seguinte:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>

</body>
</html>

No Visual Studio Code (meu editor preferido, basta você digitar html:5 e apertar enter que ele faz isso sozinho pra gente. ISso não é importante agora, mas é bom a gente começar do jeito certo. Continue seus estudos! Me enche de felicidade um novo programador no mundo! :)