0

Qual problema no meu código? Creio que a lógica esteja correta!

<h1 id="colorchange">ESTAMOS FAZENDO TESTE DE CORES COM JAVASCRIPT!</h1>
<input type="text" name="Cor" id="whatcolor"><br /><br>
<button type="button" onclick="newcolor('whatcolor')">Mudar</button>
<script>
        function newcolor(thecolor) {
        document.getElementById('colorchange').style.color = thecolor;
    }
</script>
1
  • 1
    Você aparentemente está definindo a cor de colorchange como sendo 'whatcolor' e isso não é uma cor válida. O que tentou fazer e o que esperava que acontecesse?
    – Woss
    23/04/2019 às 17:50

1 Resposta 1

1

Acredito que você esteja tentando fazer algo assim:

<h1 id="colorchange">ESTAMOS FAZENDO TESTE DE CORES COM JAVASCRIPT!</h1>
<input type="text" name="Cor" id="whatcolor"><br /><br>
<button type="button" onclick="newcolor('whatcolor')">Mudar</button>
<script>
  //A função recebe o id do elemento input e pega o seu valor
  function newcolor(id) {
    document.getElementById('colorchange').style.color = document.getElementById(id).value;
  }
</script>

Ou então pegar diretamente, sem receber o id do elemento input

<h1 id="colorchange">ESTAMOS FAZENDO TESTE DE CORES COM JAVASCRIPT!</h1>
<input type="text" name="Cor" id="whatcolor"><br /><br>
<button type="button" onclick="newcolor()">Mudar</button>
<script>
  function newcolor() {
    document.getElementById('colorchange').style.color = document.getElementById('whatcolor').value;
  }
</script>

3
  • Exatamente isso que eu queria, entendi seu código.´ Só uma dúvida, por qual motivo você teve que pegar pelo document? Sendo que o ID já estava na function.. E outro ponto, quando você chama a cor ela lê em string ou Int? Obrigado pela sua ajuda cara, estou aprendendo bastante! :))
    – Castiel
    23/04/2019 às 17:58
  • Não entendi, se eu não chamar pelo document vou chamar por onde? O id que é recebido é a string, não o elemento. O valor de document.getElementById(id).value sempre será uma string, até porque não existe cor só de numéricos, se quiser o vermelho, por exemplo, pode usar "#900", mas tem uma "#" na frente, assim como o rgb, rgba, hsl, etc (que terão parênteses e vírgula)
    – Costamilam
    23/04/2019 às 18:16
  • Oi Costa, Entendi a lógica, obrigado pelo seu apoio! ;)
    – Castiel
    24/04/2019 às 23:12

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .