Skip to main content

Es posible que pueda deberse a que el documento aún no se ha terminado de parsear y cargar.

Como recomendación, algunos puntos importantes:

Sé consciente del proceso de parseo y carga del HTML

Todo documento pasa por ubauna etapa de parseo y finalmente se carga y pasa a estar disponible. El DOM (Object Document Model) es una interface que te permite interactuar con el documento. Esta interface es la encargada de interactuar con el HTML almacenando cada etiqueta en un Nodo dentro de un árbol, el cual no es más que la representación de la etiqueta en una interface.

¿Qué tiene que ver esto con tu pregunta? Que cuando interaccionas con el documento cuando aún no ha sido completamente cargado, es muy probable que obtengas una referencia nula porque aún no ha sido parseado y no está disponible en el árbol DOM.

Una buena práctica es seleccionar los elemetos cuando el documento ha sido cargado. En puro se hace capturando el evento DOMContentLoaded:

 document.addEventListener('DOMContentLoaded', function() {
    // selecciona los elementos aquí
});

En se hace mediante el evento personalizado ready:

$(document).on('ready', function() {
    // selecciona los elementos aquí
});

Así te aseguras que los nodos estén disponibles en el árbol DOM.

No pongas scripts en la cabecera

A no ser que marques estos scripts con el atributo async o defer, no los pongas en la cabecera porque el parseo del documento no proseguirá hasta que los scripts hayan sido resueltos. En su lugar pon los scripts antes del cierre del body:

<script>
    // código abcdeghi
</script>
</body>

Ten en cuenta estos puntos al interactuar con los elementos.

Es posible que pueda deberse a que el documento aún no se ha terminado de parsear y cargar.

Como recomendación, algunos puntos importantes:

Sé consciente del proceso de parseo y carga del HTML

Todo documento pasa por uba etapa de parseo y finalmente se carga y pasa a estar disponible. El DOM (Object Document Model) es una interface que te permite interactuar con el documento. Esta interface es la encargada de interactuar con el HTML almacenando cada etiqueta en un Nodo dentro de un árbol, el cual no es más que la representación de la etiqueta en una interface.

¿Qué tiene que ver esto con tu pregunta? Que cuando interaccionas con el documento cuando aún no ha sido completamente cargado, es muy probable que obtengas una referencia nula porque aún no ha sido parseado y no está disponible en el árbol DOM.

Una buena práctica es seleccionar los elemetos cuando el documento ha sido cargado. En puro se hace capturando el evento DOMContentLoaded:

 document.addEventListener('DOMContentLoaded', function() {
    // selecciona los elementos aquí
});

En se hace mediante el evento personalizado ready:

$(document).on('ready', function() {
    // selecciona los elementos aquí
});

Así te aseguras que los nodos estén disponibles en el árbol DOM.

No pongas scripts en la cabecera

A no ser que marques estos scripts con el atributo async o defer, no los pongas en la cabecera porque el parseo del documento no proseguirá hasta que los scripts hayan sido resueltos. En su lugar pon los scripts antes del cierre del body:

<script>
    // código
</script>
</body>

Ten en cuenta estos puntos al interactuar con los elementos.

Es posible que pueda deberse a que el documento aún no se ha terminado de parsear y cargar.

Como recomendación, algunos puntos importantes:

Sé consciente del proceso de parseo y carga del HTML

Todo documento pasa por una etapa de parseo y finalmente se carga y pasa a estar disponible. El DOM (Object Document Model) es una interface que te permite interactuar con el documento. Esta interface es la encargada de interactuar con el HTML almacenando cada etiqueta en un Nodo dentro de un árbol, el cual no es más que la representación de la etiqueta en una interface.

¿Qué tiene que ver esto con tu pregunta? Que cuando interaccionas con el documento cuando aún no ha sido completamente cargado, es muy probable que obtengas una referencia nula porque aún no ha sido parseado y no está disponible en el árbol DOM.

Una buena práctica es seleccionar los elemetos cuando el documento ha sido cargado. En puro se hace capturando el evento DOMContentLoaded:

 document.addEventListener('DOMContentLoaded', function() {
    // selecciona los elementos aquí
});

En se hace mediante el evento personalizado ready:

$(document).on('ready', function() {
    // selecciona los elementos aquí
});

Así te aseguras que los nodos estén disponibles en el árbol DOM.

No pongas scripts en la cabecera

A no ser que marques estos scripts con el atributo async o defer, no los pongas en la cabecera porque el parseo del documento no proseguirá hasta que los scripts hayan sido resueltos. En su lugar pon los scripts antes del cierre del body:

<script>
    // código abcdeghi
</script>
</body>

Ten en cuenta estos puntos al interactuar con los elementos.

se eliminaron 217 caracteres en el cuerpo
Origen Enlace
gugadev
  • 19.1k
  • 1
  • 27
  • 49

Es posible que pueda deberse a que el documento aún no se ha terminado de parsear y cargar. Sin embargo, esto no debería interponerse si asocias el manejador de forma inline, por lo que es probable se deba a caché.

Como recomendación, algunos puntos importantes:

Sé consciente del proceso de parseo y carga del HTML

Todo documento pasa por uba etapa de parseo y finalmente se carga y pasa a estar disponible. El DOM (Object Document Model) es una interface que te permite interactuar con el documento. Esta interface es la encargada de interactuar con el HTML almacenando cada etiqueta en un Nodo dentro de un árbol, el cual no es más que la representación de la etiqueta en una interface.

¿Qué tiene que ver esto con tu pregunta? Que cuando interaccionas con el documento cuando aún no ha sido completamente cargado, es muy probable que obtengas una referencia nula porque aún no ha sido parseado y no está disponible en el árbol DOM.

Una buena práctica es seleccionar los elemetos cuando el documento ha sido cargado. En puro se hace capturando el evento DOMContentLoaded:

 document.addEventListener('DOMContentLoaded', function() {
    // selecciona los elementos aquí
});

En se hace mediante el evento personalizado ready:

$(document).on('ready', function() {
    // selecciona los elementos aquí
});

Así te aseguras que los nodos estén disponibles en el árbol DOM.

No pongas scripts en la cabecera

A no ser que marques estos scripts con el atributo async o defer, no los pongas en la cabecera porque la cargael parseo del documento no proseguirá hasta que los scripts hayan sido resueltos. En su lugar pon los scripts antes del cierre del body:

<script>
    // código
</script>
</body>

Ten en cuenta estos puntos al interactuar con los elementos. Además, estate pendiente de la caché, dependiendo del tipo dr servidor puede ser configurada.

Es posible que pueda deberse a que el documento aún no se ha terminado de parsear y cargar. Sin embargo, esto no debería interponerse si asocias el manejador de forma inline, por lo que es probable se deba a caché.

Como recomendación, algunos puntos importantes:

Sé consciente del proceso de parseo y carga del HTML

Todo documento pasa por uba etapa de parseo y finalmente se carga y pasa a estar disponible. El DOM (Object Document Model) es una interface que te permite interactuar con el documento. Esta interface es la encargada de interactuar con el HTML almacenando cada etiqueta en un Nodo dentro de un árbol, el cual no es más que la representación de la etiqueta en una interface.

¿Qué tiene que ver esto con tu pregunta? Que cuando interaccionas con el documento cuando aún no ha sido completamente cargado, es muy probable que obtengas una referencia nula porque aún no ha sido parseado y no está disponible en el árbol DOM.

Una buena práctica es seleccionar los elemetos cuando el documento ha sido cargado. En puro se hace capturando el evento DOMContentLoaded:

 document.addEventListener('DOMContentLoaded', function() {
    // selecciona los elementos aquí
});

En se hace mediante el evento personalizado ready:

$(document).on('ready', function() {
    // selecciona los elementos aquí
});

Así te aseguras que los nodos estén disponibles en el árbol DOM.

No pongas scripts en la cabecera

A no ser que marques estos scripts con el atributo async o defer, no los pongas en la cabecera porque la carga del documento no proseguirá hasta que los scripts hayan sido resueltos. En su lugar pon los scripts antes del cierre del body:

<script>
    // código
</script>
</body>

Ten en cuenta estos puntos al interactuar con los elementos. Además, estate pendiente de la caché, dependiendo del tipo dr servidor puede ser configurada.

Es posible que pueda deberse a que el documento aún no se ha terminado de parsear y cargar.

Como recomendación, algunos puntos importantes:

Sé consciente del proceso de parseo y carga del HTML

Todo documento pasa por uba etapa de parseo y finalmente se carga y pasa a estar disponible. El DOM (Object Document Model) es una interface que te permite interactuar con el documento. Esta interface es la encargada de interactuar con el HTML almacenando cada etiqueta en un Nodo dentro de un árbol, el cual no es más que la representación de la etiqueta en una interface.

¿Qué tiene que ver esto con tu pregunta? Que cuando interaccionas con el documento cuando aún no ha sido completamente cargado, es muy probable que obtengas una referencia nula porque aún no ha sido parseado y no está disponible en el árbol DOM.

Una buena práctica es seleccionar los elemetos cuando el documento ha sido cargado. En puro se hace capturando el evento DOMContentLoaded:

 document.addEventListener('DOMContentLoaded', function() {
    // selecciona los elementos aquí
});

En se hace mediante el evento personalizado ready:

$(document).on('ready', function() {
    // selecciona los elementos aquí
});

Así te aseguras que los nodos estén disponibles en el árbol DOM.

No pongas scripts en la cabecera

A no ser que marques estos scripts con el atributo async o defer, no los pongas en la cabecera porque el parseo del documento no proseguirá hasta que los scripts hayan sido resueltos. En su lugar pon los scripts antes del cierre del body:

<script>
    // código
</script>
</body>

Ten en cuenta estos puntos al interactuar con los elementos.

Origen Enlace
gugadev
  • 19.1k
  • 1
  • 27
  • 49

Es posible que pueda deberse a que el documento aún no se ha terminado de parsear y cargar. Sin embargo, esto no debería interponerse si asocias el manejador de forma inline, por lo que es probable se deba a caché.

Como recomendación, algunos puntos importantes:

Sé consciente del proceso de parseo y carga del HTML

Todo documento pasa por uba etapa de parseo y finalmente se carga y pasa a estar disponible. El DOM (Object Document Model) es una interface que te permite interactuar con el documento. Esta interface es la encargada de interactuar con el HTML almacenando cada etiqueta en un Nodo dentro de un árbol, el cual no es más que la representación de la etiqueta en una interface.

¿Qué tiene que ver esto con tu pregunta? Que cuando interaccionas con el documento cuando aún no ha sido completamente cargado, es muy probable que obtengas una referencia nula porque aún no ha sido parseado y no está disponible en el árbol DOM.

Una buena práctica es seleccionar los elemetos cuando el documento ha sido cargado. En puro se hace capturando el evento DOMContentLoaded:

 document.addEventListener('DOMContentLoaded', function() {
    // selecciona los elementos aquí
});

En se hace mediante el evento personalizado ready:

$(document).on('ready', function() {
    // selecciona los elementos aquí
});

Así te aseguras que los nodos estén disponibles en el árbol DOM.

No pongas scripts en la cabecera

A no ser que marques estos scripts con el atributo async o defer, no los pongas en la cabecera porque la carga del documento no proseguirá hasta que los scripts hayan sido resueltos. En su lugar pon los scripts antes del cierre del body:

<script>
    // código
</script>
</body>

Ten en cuenta estos puntos al interactuar con los elementos. Además, estate pendiente de la caché, dependiendo del tipo dr servidor puede ser configurada.