Saltar al contenido

No se puede establecer la propiedad ‘innerHTML’ de null

Ya no necesitas buscar más por todo internet porque has llegado al lugar indicado, tenemos la respuesta que necesitas hallar y sin complicaciones.

Solución:

Tienes que colocar el hello div antes del script, para que exista cuando se carga el script.

Primero tratemos de entender la causa raíz de por qué está sucediendo en primer lugar.

¿Por qué aparece un error o TypeError no capturado: no se puede establecer la propiedad ‘innerHTML’ de null?

El navegador siempre carga todo el HTML DOM de arriba a abajo. Cualquier código JavaScript escrito dentro del script etiquetas (presentes en head sección de su archivo HTML) es ejecutado por el motor de renderizado del navegador incluso antes de que se cargue todo su DOM (varias etiquetas de elementos HTML presentes dentro de la etiqueta del cuerpo). Los guiones presentes en head etiqueta están tratando de acceder a un elemento que tiene id hello incluso antes de que se haya renderizado en el DOM. Entonces, obviamente, JavaScript no pudo ver el elemento y, por lo tanto, terminas viendo el null error de referencia

¿Cómo puedes hacer que funcione como antes?

Desea mostrar el mensaje “hola” en la página tan pronto como el usuario llegue a su página por primera vez. Por lo tanto, debe conectar su código en un punto en el que esté completamente seguro del hecho de que DOM está completamente cargado y el hello el elemento id está accesible/disponible. Se puede conseguir de dos formas:

  1. Reordenar sus guiones: De esta manera, sus scripts se activan solo después de que el DOM que contiene su hello El elemento id ya está cargado. Puede lograrlo simplemente moviendo la etiqueta del script después de todos los elementos DOM, es decir, en la parte inferior donde body la etiqueta está terminando. Dado que la representación ocurre de arriba a abajo, sus scripts se ejecutan al final y no enfrenta ningún error.
    
    
    
    
    Untitled Document
    
    
    
    

  1. Usar enlace de eventos: El motor de renderizado del navegador proporciona un enlace basado en eventos window.onload evento que le da la pista de que el navegador ha terminado de cargar el DOM. Entonces, cuando se active este evento, puede estar seguro de que su elemento con hello id ya está cargado en el DOM y cualquier JavaScript activado posteriormente que intente acceder a este elemento no fallará. Así que haces algo como el siguiente fragmento de código. Tenga en cuenta que, en este caso, su secuencia de comandos funciona aunque esté presente en la parte superior de su documento HTML. dentro de head etiqueta.

        
        
        
        Untitled Document
        
        
        
        
        

Podrías decirle a javascript que realice la acción “onload”… Prueba con esto:


Aquí puedes ver las reseñas y valoraciones de los lectores

Al final de la web puedes encontrar las críticas de otros sys admins, tú igualmente tienes la opción de insertar el tuyo si te apetece.

¡Haz clic para puntuar esta entrada!
(Votos: 2 Promedio: 4.5)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *