Entrar ¿Aún no tienes acceso?
Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
3
respuestas

Error

Referente al curso JavaScript: Introducción al lenguaje de la web, en el capítulo Variables y Operadores y actividad Operadores lógicos

por Valentina
| 68.7k xp | 39 posts

buenas tardes tengo el siguiente error al intentar obtener el valor de un id y no se que error estoy cometiendo. TypeError: Cannot read properties of null (reading 'querySelector')

Código java script

var paciente=document.querySelector("#primer-paciente") console.log(paciente);

var w = paciente.querySelector(".info-peso"); console.log(w);

var weight = w.textContent; console.log(weight);

var h = paciente.querySelector(".info-altura"); console.log(h);

var height = h.textContent; console.log(height);

var tdIMD = paciente.querySelector(".info-imc")

var Imc = weight/(height*height);

tdIMD.textContent = Imc;

Código HTML

    <header>
        <div class="container">
            <h1>Buona Vita Nutrición</h1>
        </div>
    </header>
    <main>
        <section class="container">
            <h2>Mis pacientes</h2>
            <table>
                <thead>
                    <tr>
                        <th>Nombre</th>
                        <th>Peso(kg)</th>
                        <th>Altura(m)</th>
                        <th>Gordura Corporal(%)</th>
                        <th>IMC</th>
                    </tr>
                </thead>
                <tbody id="tabla-pacientes">
                    <tr class="paciente" id="primer-paciente">
                        <td class="info-nombre">Pablo</td>
                        <td class="info-peso">100</td>
                        <td class="info-altura">2.00</td>
                        <td class="info-gordura">10</td>
                        <td class="info-imc">0</td>
                    </tr>

                    <tr class="paciente" >
                        <td class="info-nombre">Juan</td>
                        <td class="info-peso">80</td>
                        <td class="info-altura">1.72</td>
                        <td class="info-gordura">40</td>
                        <td class="info-imc">0</td>
                    </tr>

                    <tr class="paciente" >
                        <td class="info-nombre">Erica</td>
                        <td class="info-peso">54</td>
                        <td class="info-altura">1.64</td>
                        <td class="info-gordura">14</td>
                        <td class="info-imc">0</td>
                    </tr>

                    <tr class="paciente">
                        <td class="info-nombre">Diego</td>
                        <td class="info-peso">85</td>
                        <td class="info-altura">1.73</td>
                        <td class="info-gordura">24</td>
                        <td class="info-imc">0</td>
                    </tr>
                    <tr class="paciente" >
                        <td class="info-nombre">Tatiana</td>
                        <td class="info-peso">46</td>
                        <td class="info-altura">1.55</td>
                        <td class="info-gordura">19</td>
                        <td class="info-imc">0</td>
                    </tr>
                </tbody>
            </table>

        </section>
    </main>

</body>
3 respuestas
por Miguel Enrique Bada
| 115.1k xp | 4 posts

Hola Valentina, miré el código y te falta poner la ruta de donde el index.html va a llamar a las funciones de javaScript después del .

        </main>

        <script src="js/nombreDelArchivo.js"></script>

</body>

Y en la primera línea te falta un punto y coma: var paciente=document.querySelector("#primer-paciente") console.log(paciente); seria:

var paciente = document.querySelector("#primer-paciente");
console.log(paciente);

Cambiando eso anda perfecto!

por Estudiante
| 129k xp | 153 posts

Falta que importes o incluyas el archivo javascript

 <script src="archivo.js"></script>

o bien lo escribas dentro del html

 var paciente=document.querySelector("#primer-paciente") console.log(paciente);
var w = paciente.querySelector(".info-peso"); console.log(w);
var weight = w.textContent; console.log(weight);
var h = paciente.querySelector(".info-altura"); console.log(h);
var height = h.textContent; console.log(height);
var tdIMD = paciente.querySelector(".info-imc")
var Imc = weight/(height*height);

tdIMD.textContent = Imc;
</script>

Saludos.-

Si el aporte te ayudó, marca como solucionado ✓ Y vamos continúa con tus estudios, y si tienes alguna pregunta, ¡no dudes en consultarme! 😊🤓
por Valentina
| 68.7k xp | 39 posts

Muchas gracias , el script lo tenia arriba en la etiqueta de head y por eso no funcionaba , apenas lo deje abajo de la etiqueta main funciono.