David Farinango
PreguntaTengo una duda, estaba usando innerHTML y me sale este error: Uncaught TypeError: Cannot read property ‘innerHTML’ of null
at prueba.js:41
Aqui esta el codigo HTML
<body> <div class="box" id="ya"> <a href="eproduct.html"> <img src="./imagenes/products/3.png" alt="productos" height="250" width="200"> </a> </div> </body>
y en javascript
document.getElementById("ya").innerHTML +='<h6><strong>Hola</strong> <br>que tal</h6>';
Según leí en algún post sobre este error, se da comunmente porque la secuencia de datos esta en la cabecera del html, es decir que añado js en el head del html, y cuando la variable intenta encontrar getElementById(“ya”) la variable id aun no existe, por lo que sale ese error, de que manera puedo solucionar para que no salga mas este error? ya que si hago este código si me funciona:
Solo dentro del html
<body> <div class="box" id="ya"> <a href="eproduct.html"> <img src="./imagenes/products/3.png" alt="productos" height="250" width="200"> </a> </div> <script> document.getElementById("ya").innerHTML +='<h6><strong>Hola</strong> <br>que tal</h6>'; </script> </body>
Pero lo que quiero es validar que todos los id del html ya esten creados correctamente para ser usado en un archivo javascript externo, agradecería muchísimo su ayuda.
- div y class deben ir separados
- a y href tambien
Roger Carlos Ariel Alba
Hola de nuevo @jdfarinango
He revisado despacio tu codigo, encontre un par de detalles.
puede que por eso no hubiese reconocido correctamente el HTML y por lo tanto no encontraba a que llamar en el JS
te coloco el codigo que he probado, revisalo y me cuentas:
<html> <head> <title> Example </title> </head> <body> <div class="box" id="ya"> <a href="eproduct.html"> <img src="./imagenes/products/3.png" alt="productos"> </a> </div> </body> </html>
junto a eso coloque el JS externo de esta forma
document.getElementById('ya'); ya.innerHTML +='<h6><strong>Hola</strong><br>que tal </h6>';
Esto lo hice con el codigo que tu colocaste y funciona.
Espero ser de ayuda, me cuentas.
David Farinango
Hola @CarlosAlba, ya le intente tu solución poniendo asi en el archivo js:
var boxYa = document.getElementById("ya"); boxYa.innerHTML +='<h6><strong>Hola</strong> <br>que tal</h6>';
Pero sigue saliendome el mismo error en consola: Uncaught TypeError: Cannot read property ‘innerHTML’ of null
at prueba.js:43, al ejecutar el .innerHTML
David Farinango
<code>
Roger Carlos Ariel Alba
Hola!
el dogument.getElementById lo usas para almacenar el “Elemento” en una variable. Por ejemplo la varable “boxYa” luego esa variable es la que recibe el .innerHTML
boxYa.innerHTML…
Espero te sirva.
Saludos!
