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

Erro mesmo no exercício baixado do site

Boa noite! To tentando acompanhar a aula 3.2 de javascript mas ta bem difícil! Tentei fazer do meu jeito e deu erro. Então tentei baixar do próprio site, e dá o mesmo erro. Acho que o problema não sou eu.

To tentando pegar o peso de paulo pelo código:

var peso = document.getElementById("peso-1").textContent; // pega o peso do paciente
var altura = document.getElementById("altura-1").textContent; // pega a altura do paciente
var nome = document.getElementById("nome-1").textContent; // pega o nome do paciente

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

if(paciente.altura != 0){
    var imc = paciente.peso / (paciente.altura * paciente.altura);

    var tdDoImc = document.getElementById("imc-1"); // pega o td do imc do paciente 1
    tdDoImc.textContent = imc; //Altera o conteúdo do td para o valor da variável imc

    console.log(imc);
}else{
    console("Não posso executar uma divisão por 0!");
}

Mas no navegador dá sempre o erro "TypeError: document.getElementById(...) is null"

Alguém pode dar uma forcinha ai?

10 respostas

Esqueci de avisar: O peso de Paulo não está vazio, está preenchido corretamente.

Poderia compartilhar o seu html?

<!doctype html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Meus pacientes</title>
        <link rel="stylesheet" type="text/css" href="reset.css">
        <link rel="stylesheet" type="text/css" href="alura.css">
    </head>
    <body>
        <header>
            <div class="container">
                <h1>Meus pacientes</h1>
            </div>
        </header>
        <main class="container">
            <section>
                <h2>Meus pacientes</h2>
                <table>
                    <tr>
                        <th>Nome</th>
                        <th>Peso(kg)</th>
                        <th>Altura(m)</th>
                        <th>IMC</th>
                    </tr>
                    <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>
                    <tr class="paciente">
                        <td class="info-nome">Paulo</td>
                        <td class="info-peso" id="peso-2">100</td>
                        <td class="info-altura" id="altura-2">2.00</td>
                        <td class="info-imc" id="imc-2"></td>
                    </tr>
                </table>
                <button id="calcula-imcs" class="botao ">Calcular Imcs</button>
            </section>
            <section>
                <h2>Adicionar novo paciente</h2>    
                <form>
                    <fieldset>
                        <label for="nome">Nome:</label>
                        <input id="campo-nome" type="text" placeholder="digite o nome do seu paciente">
                    </fieldset>
                    <fieldset class="campo-medio">
                        <label for="peso">Peso:</label>
                        <input id="campo-peso" type="text" placeholder="digite o peso do seu paciente">
                    </fieldset>
                    <fieldset class="campo-medio">
                        <label for="altura">Altura:</label>
                        <input id="campo-altura" type="text" placeholder="digite a altura do seu paciente">
                    </fieldset>
                    <button id="adicionar-paciente" class="botao bto-principal">Adicionar</button>
                </form>
            </section>
        </main>
        <script src="calcula-imc.js"></script>
    </body>
</html>

Tentei por o código como bloco de texto mas não foi, conforme apareceu acima. O código HTML é o fornecido no curso de javascript aula 3, Download aqui

Utiliza 3 acentos graves para formatar

Sim eu sei, mas por algum motivo não está formatando o código que mando. (Pode perceber que os três acentos estão aparecendo antes e depois do código.

solução!

O erro se encontra na seguinte linha:

var nome = document.getElementById("nome-1").textContent; // pega o nome do paciente

No html existem arquivos com este id "nome-1", por isso da erro e não executa o resto.

Não existem

Desculpa me atrapalhei um pouco com as palavras.

Não existem tags que tenham o id "nome-1", por isso acontece o erro.

Putz, cara! Não sabia que no JS o código inteiro não rodava por causa de um errinho. Valeu!