Trabalhando com campos de texto em JavaScript
Agora vamos aprender a obter texto
dos usuários do nosso site. Para isso,
o HTML fornece uma tag especial input,
que representa um campo de texto para entrada
de dados.
<input>
Esta tag tem um atributo especial value,
que define o texto inicial que será escrito
no input ao acessar a página:
<input value="texto">
O usuário do nosso site, após acessar a
página, pode alterar o texto do input.
Neste caso, se temos uma variável contendo
uma referência a este input, a propriedade value
desta variável sempre conterá o valor
atual do texto do input.
Vamos tentar na prática. Suponha que temos um input
com o atributo value:
<input id="elem" value="texto">
Vamos obter a referência a este input em uma variável:
let elem = document.querySelector('#elem');
E agora vamos exibir o texto atual do input na tela:
console.log(elem.value);
E agora vamos alterar o texto do input para outro:
elem.value = 'novo texto';
Dado um input e um botão. Ao clicar no botão, escreva algum texto no input.
Dado um input, um parágrafo e um botão. Ao clicar no botão, escreva no parágrafo o texto do input.
Dados dois inputs e um botão. No primeiro input, o usuário insere um número. Ao clicar no botão, escreva no segundo input o quadrado do número inserido.
Dados dois inputs e um botão. Ao clicar no botão, escreva no primeiro input o valor do segundo input e no segundo input - o valor do primeiro. Seu código deve funcionar de forma universal, para quaisquer valores dos inputs.
Dados 5 inputs, um parágrafo e um botão. Nos
inputs são inseridos números. Ao clicar no botão,
escreva a média aritmética dos números inseridos no parágrafo.