Encontramos la respuesta a esta cuestión, al menos eso creemos. Si tienes dudas coméntalo y sin tardar
Solución:
window.onload
simplemente se ejecuta cuando el navegador llega a él.
window.addEventListener
espera a que se cargue la ventana antes de ejecutarla.
En general, debe hacer lo segundo, pero debe adjuntarle un detector de eventos en lugar de definir la función. Por ejemplo:
window.addEventListener('load',
function()
alert('hello!');
, false);
Las otras respuestas parecen desactualizadas.
En primer lugar, poner guiones en la parte superior y usar window.onload
es un antipatrón. Son restos de los días de IE en el mejor de los casos o malentendidos de JavaScript y el navegador en el peor de los casos.
Simplemente puede mover sus scripts al final de su html
My Page
content
La única razón por la que la gente usaba window.onload
es porque creyeron erróneamente que los guiones debían ir en el head
sección. Debido a que las cosas se ejecutan en orden si su secuencia de comandos estaba en la sección principal, entonces el cuerpo y su contenido aún no existían por definición de ejecutar en orden.
La solución hacky fue usar window.onload
esperar a que se cargue el resto de la página. Mover su secuencia de comandos al final también resolvió ese problema y ahora no hay necesidad de usar window.onload
ya que su cuerpo y contenido ya habrán sido cargados.
La solución más moderna es utilizar el defer
etiqueta en sus scripts, pero para usarlos, sus scripts deben ser todos externos.
Esto tiene la ventaja de que el navegador comenzará a descargar los scripts inmediatamente y los ejecutará en el orden especificado, pero esperará para ejecutarlos hasta que la página se haya cargado, sin necesidad de window.onload
o mejor, pero aún innecesario window.addEventListener('load', ...
Aquí está la documentación en MDN.
De acuerdo a esto:
El evento de carga se activa al final del proceso de carga del documento. En este punto, todos los objetos del documento están en el DOM y todas las imágenes y subtramas han terminado de cargarse.
Su primer fragmento de código se ejecutará tan pronto como el navegador llegue a este punto en HTML.
El segundo fragmento activará una ventana emergente cuando el DOM y todas las imágenes estén completamente cargadas (consulte las especificaciones).
Considerando el alert()
función, realmente no importa en qué punto se ejecutará (no depende de nada además de window
objeto). Pero si desea manipular el DOM, definitivamente debe esperar a que se cargue correctamente.
Puedes añadir valor a nuestra información tributando tu experiencia en las explicaciones.