Solucionado (ver solução)
Solucionado
(ver solução)
4
respostas

E se nesse caso eu quiser pegar o segundo <input>?

se eu pedir no console o input.value, aparece sempre o valor do primeiro input, como faço pra pegar o valor do segundo input e assim adiante?

<meta charset="UTF-8">
<input/>
<br>
<input/>
<script>
    var input = document.querySelector('input')
    var input2 = document.querySelector('input')
</script>
4 respostas

Você pode usar o querySelectorAll.

O exemplo abaixo usa a TAG <p>:

<script>
function myFunction() {
  var x, i;
  x = document.querySelectorAll("p");
  for (i = 0; i < x.length; i++) {
    x[i].style.backgroundColor = "red";
  }
}
</script>

Só tem que adaptar à sua necessidade.

eu não entendi esse código cara, eu to no curso de logica, ainda não peguei quase nada de js, pode mandar com um código mais simples, por favor?

solução!

João,

Você pode tentar algumas abordagens diferentes.

Exemplo:

<input id="input1" value="valor 1">
<input id="input2" value="valor 2">
<script>
    var input1 = document.getElementById("input1");
    var input2 = document.getElementById("input2");
    console.log(input1.value); // input 1 - retorna "valor 1"
    console.log(input2.value); // input 2 - retorna "valor 2"
</script>

Também pode usar o querySelectorAll (como Cristiano demonstrou acima), ele vai retornar uma lista (array) de inputs e usando o index (identificador sequencial do item da lista) você pode acessa-los; Veja outro exemplo:

<input value="valor 1">
<input value="valor 2">
<script>
    var inputs = document.querySelectorAll("input");
    console.log(inputs[0].value); // input 1 - retorna "valor 1"
    console.log(inputs[1].value); // input 2 - retorna "valor 2"
</script>

Perfeita explicação, Douglas, entendi certinho, muito obrigado!!!

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software