innerHTML não escreve texto na div “res”

Home Fóruns JavaScript innerHTML não escreve texto na div “res”

Visualizando 4 respostas da discussão
  • Autor
    Posts
    • #69034
      Octavio Lustosa
      Participante

      Olá.
      Estou com dificuldade na Aula 11 Condições Pt I JavaScript!
      link da aula: https://www.estudonauta.com/licao/javascript-11-condicoes-parte-1/

      Próximo ao minuto 22, o professor cria uma div com id “res”
      Em seguida, referencia essa div pelo nome para inserir o texto: “Sua velocidade atual é de ${}Km/h”

      Porém nesse caso, não aparece essa mensagem no meu navegador, tentei outros formatos porém sem sucesso.

      Se alguém puder ajudar, agradeço! \o/

      Segue meu código conforme a aula descreve:

      <body>
      <h1>Sistema de Multas</h1>
      Velocidade do carro: <input type=”number” name=”txtvel” id=”txtvel”> Km/h
      <input type=”button” value=”Verificar” onclick=”calcular”>
      <div id=”res”> <!–DIV CRIADA COM ID “RES”–>

      </div>
      <script>
      function calcular() {
      var txtv = window.document.querySelector(‘input#txtvel’)
      var res = window.document.querySelector(‘div#res’)
      var vel = Number(txtv.value)
      res.innerHTML = Sua velocidade atual é de ${vel}Km/h //TEXTO INSERIDO NÃO APARECE!!!
      }
      </script>
      </body>

      • Este tópico foi modificado 3 anos, 5 meses atrás por Tutora Mayla.
    • #69124
      Tutora Mayla
      Mestre

      Octavio, o porquê de a mensagem não aparecer na tela se dá pela falta de parênteses no momento de chamar a função no botão Verificar.
      <input type="button" value="Verificar" onclick="calcular">

      O valor esperado dentro do atributo onclick é uma chamada de função, e portanto a forma correta de escrever esta linha seria:
      <input type="button" value="Verificar" onclick="calcular()">

      Espero ter ajudado, quaisquer outras dúvidas basta entrar em contato.

    • #104239

      Boa tarde, nesta mesma aula o professor pede para fazermos uma condição composta com a nacionalidade se é brasileiro ou não

      Eu não consigo fazer com que o texto que eu digito na página apareça sei que número tenho que colocar o Number(,,,.value) será que tenho que colocar algum item para aparecer texto no div??

      O código que digitei está abaixo:

      Em que país você mora: <input type=“text” name=“txt1” id=“txt1”>
      <input type=“button” value=“Verificar” onclick=“nacionalidade()”>
      <div class=“res”></div>
      <script>
      let nac = window.document.getElementById(“txt1”)
      let resultado = document.querySelector(“div.res”)
      funcion nacionalidade(){
      resultado.innerHTML = nac
      }

      Nesse exemplo eu só queria que a página divulgasse o nome que digitei mas não aparece nada…

    • #114815
      Pedro Henrique Peres
      Participante

      <!DOCTYPE html>
      <html lang=”pt-BR”>
      <head>
      <meta charset=”UTF-8″>
      <meta http-equiv=”X-UA-Compatible” content=”IE=edge”>
      <meta name=”viewport” content=”width=device-width, initial-scale=1.0″>
      <title>Document</title>
      </head>
      <body>
      <h1>Sistema de multas</h1>
      Velocidade do carro : <input type=”number” name=”txtvel” id=” txtvel” > Km/h

      <input type=”button” value=”verificar” onclick=”calcular()”>
      <div id=”res” >
      </div>
      <script>

      function calcular(){
      var txtv = window.document.getElementsByTagName(‘txtvel’)
      var res = window.document.querySelector(‘div#res’)
      var vel = Number(txtv.value)
      res.innerHTML = Sua velocidade atual é ${vel} VARIAVEL APARECE COMO ‘NaN
      }
      </script>
      </body>
      </html>

      • #114990
        Tutora Vera
        Mestre

        Pedro, quando a variável aparece como NaN significa not a number e aí ela geralmente aparece quando o JavaScript tenta realizar operações númericas com elementos que não são números. Revise o código linha por linha e se ainda sim não encontrar o problema nos retorne.

    • #114989
      Tutora Jessica
      Moderador

      Ola Pedro, alguma dúvida?

Visualizando 4 respostas da discussão
  • Você deve fazer login para responder a este tópico.