Na tag INPUT.VALUE ele ja pega o </ input> do mundo HTML direto ou do valor da variavel input. E tambem button.onclick se ele pega ja da parte HTML ou e so porcausa da variavel
Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
Na tag INPUT.VALUE ele ja pega o </ input> do mundo HTML direto ou do valor da variavel input. E tambem button.onclick se ele pega ja da parte HTML ou e so porcausa da variavel
Oii Keitiane, como você está?
As tags são elementos de marcação do mundo HTML. Isso quer dizer que tudo que colocamos nesse mundo é o que estará aparecendo na tela para o usuário quando carregarmos nossa página. Para lidar com esses elementos dentro do mundo JavaScript, utilizamos o document e variáveis para buscar as informações, e então podemos deixar o programa mais interativo a partir da linguagem de programação.
Vamos analisar mais de perto esse trecho de código:
<meta charset="UTF-8">
<input/>
<button>Compare com o meu segredo</button>
<script>
var input = document.querySelector("input");
input.value
</script>Aqui, o input.value está no mundo JS. value é um comando específico do JavaScript que retorna o valor que está dentro de uma variável, e ele não interage diretamente com tags, que são do mundo HTML. Por esse motivo a tag foi atribuída à uma variável por meio do comando document.querySelector antes de qualquer outra coisa ser feita dentro do mundo JS: agora, sempre que quisermos fazer alguma coisa que tenha relação com o que o usuário digitou dentro do campo que está na tela, utilizaremos a variável input que está armazenando essa informação.
O caso de button.onclick é bastante parecido:
var button = document.querySelector("button");
button.onclick = verifica;Perceba que a atribuição da variável vem antes do comando onclick. Isso quer dizer que sempre que a palavra button aparecer dentro do nosso código ela significará o resultado da button, mas isso só pode acontecer através do comando document.querySelector que é quem pode interagir diretamente com o mundo HTML. Com a variável, essa informação já fica guardada e pode se repetir sem a necessidade de digitarmos todo esse comando a cada vez que for necessário lidar com alguma tag.
Para que os nomes não se confundam, você pode até escolher chamar as variáveis com outro nome, em português por exemplo:
<meta charset="UTF-8">
<input/>
<button>Compare com o meu segredo</button>
<script>
var segredo = 5;
var entrada = document.querySelector("input");
function verifica() {
if(entrada.value == segredo) {
alert("Você ACERTOU!");
} else {
alert("Você ERROU!!!!!!!!");
}
}
var botao = document.querySelector("button");
botao.onclick = verifica;
</script>Assim é possível ver de forma mais clara quando estamos digitando o nome da tag ou da variável.
Espero ter esclarecido sua dúvida, Keitiane. Estou à disposição!
Um forte abraço.