1
resposta

[Dúvida] Apagar Campo

Na hora de realizar a funcionalidade de apagar o valor do campo do input, tentei simplesmente mudar o conteúdo da variável "chute", conforme as últimas linhas do código. Entretanto, dessa forma simplesmente não funciona, mas se em vez de "chute" escrever novamente "document.querySelector("input").value" funciona normalmente. Por que isso ocorre? sendo que já foi defenido que a variável chute é exatamente "document.querySelector("input").value"?

function verificarChute(){
    let chute = document.querySelector("input").value;
    if(chute == numeroSecreto){
        exibirTextoNaTela("h1", "Acertou");
        let palavraTentativa = tentativas>1 ? " tentativas" : " tentativa";
        exibirTextoNaTela("p", "Você descobriu o número secreto com "+tentativas+palavraTentativa);
    }else{
        if(chute > numeroSecreto){
            exibirTextoNaTela("p", "O numero secreto é menor");
        }else{
            exibirTextoNaTela("p", "O numero secreto é maior");
        }
        tentativas++;
        chute = ''; // Nao funciona 
        //document.querySelector("input").value ='';
    }
}
1 resposta

Oii Yann, tudo bem?

Quando você define let chute = document.querySelector("input").value;, você está atribuindo à variável chute o valor que está no campo de input no momento em que essa linha de código é executada. Ou seja, chute não é uma referência ao campo de input em si, mas sim ao valor que ele continha naquele instante.

Então, quando você tenta limpar o campo de input com chute = '', o que você está fazendo é alterar o valor da variável chute, mas isso não tem efeito sobre o campo de input na página.

Por outro lado, quando você usa document.querySelector("input").value ='';, você está acessando diretamente o campo de input na página e alterando seu valor para uma string vazia. É por isso que essa linha de código consegue limpar o campo.

No exemplo da aula, a função limparCampo foi criada justamente para realizar essa tarefa. Ela primeiro obtém uma referência ao campo de input com chute = document.querySelector('input'); e então limpa o campo com chute.value = '';.

Um abraço e bons estudos.