Solucionado (ver solução)

Importante

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!

Solucionado
(ver solução)
16
respostas

Dúvida no Ex. 3 da Aula 3 - Conhecendo o DOM e organizando nosso código com objetos

Fiz exatamente como consta no exercicio e está me retornando este erro no console do chrome... Alguem sabe me dizer do que se trata?

Uncaught TypeError: Cannot read property 'textContent' of null

16 respostas

Olá Milton! Por favor disponibilize aqui o seu código para que possamos ajuda-lo.

rsrs.. Desculpem-me!

Segue o HTML:

<!doctype html>

Meus pacientes

Meus pacientes

Nome Peso(kg) Altura(m) IMC Leonardo 57 1.67 Paulo 100 2.00 Calcular Imcs

Adicionar novo paciente

Nome: Peso: Altura: Adicionar

Segue o JS:

var peso = document.getElementById("peso-1").textContent; <----- O ERRO É GERADO NESTA LINHA!!! var altura = document.getElementById("altura-1").textContent; var nome = document.getElementById("nome-1").textContent;

var paciente = { peso : peso, altura : altura, nome : nome };

if(paciente.altura != 0){ var imc = paciente.peso / (paciente.altura * paciente.altura); var tdImc = document.getElementById("imc-1"); tdImc.textContent = imc; console.log("IMC igual:"+ imc); }else{ console.log("Não pode fazer divisão por '0'"); }

Leonardo 57 1.67

Esses são os dados que estou tentando acessar no HTML....

não consigo postar o Html... ele troca os valores...rsrs!

Ponha entre crases o seu codigo HTML ( ``` )

Assim:

( ``` )

Seu código aqui

( ``` )

Mas sem os parenteses!!

    <tr class="paciente">
                        <td class="info-nome">Leonardo</td>
                        <td class="info-peso" id="peso-1">57</td>
                        <td class="info-altura" id="altura-1">1.67</td>
                        <td class="info-imc" id="imc-1"></td>
                    </tr>

vamos ver se vai...rs

Milton, eu testei seu código e ele funcionou corretamente. Verifique se os arquivos que você mandou a configuração estão na mesma pasta.

Não sei então. Porque eles estão exatamente como mandei. Não tem nenhum outro arquivo de config. O erro é exibido no console do chrome.

Mas os arquivos estão na mesma pasta? As vezes, pode acontecer de abrirmos o editor com o arquivo em uma determinada pasta, então com o editor aberto mudarmos o arquivo de pasta e realizarmos alterações. No entanto, ao salvarmos o arquivo com as alterações, ele será salvo na pasta onde abrimos e não na nova onde o arquivo se encontra. É normal isso acontecer. O seu código JavaScript está correto, verifique se o seu arquivo HTML que se encontra na mesma pasta que o arquivo JavaScript está configurado corretamente.

Espero ter ajudado!

Olha... não ajudou não...rs fiz novos testes com códigos diferentes..

HTML

<!doctype html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>Teste</title>
        <script src="teste.js"></script>
    </head>
    <body>
        <h1 id="peso2">57</h1>
    </body>
</html>

JS

var peso2 = document.getElementById("peso2");

console.log(peso2);

console.log(peso2.textContent); -- linha 5

O retorno no console é..

null e o mesmo erro: Uncaught TypeError: Cannot read property 'textContent' of nulo -- na linha 5

--'

solução!

Identifiquei agora o problema, pois você mandou parte de seu código HTML.

O problema é que você pôs a referencia ao arquivo JavaScript em sua tag <head> Quando ela deveria estar ao final da tag <body> . Da seguinte forma:

<body>
          // RESTANTE DO CÓDIGO 

          <script src="teste.js"></script>
</body>

AEEEEEEEEEEEEE!!!! Era isso mesmo, pra mim tinha que declarar no head...

VALEUUUUUUUUUUUUUUUU!!!

Abraço!!!

Romário, por que precisamos por só no final do

?

Sorry... Por que só no final do <body>?

Nossa Romario, valeu mesmo kkk. Pesquisei em vários post e só aqui encontrei a resposta. Fiquei umas duas horas procurando o bug kk.

Hugo acredito que não é necessário colocar no final, mas para funcionar deve estar depois do elemento que você quer pegar, Exemplo, tu quer pegar o elemento que esta na id = 'qualquerCoisa' ele tem que vim depois.

...
<h1 id = 'qualquerCoisa'>123</h1>
<script> 
document.getElementById('qualquerCoisa')
</script>
...

Caso seja colocado antes, ele irá te retornar o resultado como null ao invés de ser 123. O que faz lógica, porque ele ainda não existe.

Tive o mesmo problema e como o Eduardo Ribeiro comentou, ele ainda não carregou o arquivo.js. Encontrei a solução procurando no Google.