Diferencia entre la ventana.Onload y $.listo

Diferencia entre la ventana.Onload y $.listo

El "ventana.encendido" y el "$ (documento).listo()"Se utilizan para ejecutar el código JavaScript cuando la página termina de cargarse, pero la principal diferencia es cuando se ejecutan y cómo se usan. "ventana.Onload "espera que todos los activos en la página finalicen la carga, incluidas las imágenes y otros recursos externos, mientras que" $ (documento).Ready () "espera a que el DOM se cargue por completo, pero no espera que los recursos externos como las imágenes terminen de cargar.

Esta publicación definirá la diferencia/variaciones entre la "ventana.Onload "y el" $ (documento).listo()".

Diferencia entre la "ventana.Onload "y" $ (documento).listo()"

"ventana.encendido" y "$ (documento).listo()"Son diferentes en la ejecución del código JavaScript cuando la página termina cargando. Las siguientes son las variaciones clave entre estos dos:

"ventana.onload " "$ (Documento).listo()"
"ventana.Onload ”es un evento de JavaScript incorporado. "$ (Documento).Ready () ”es específico para la biblioteca jQuery.
Espera hasta que todos los activos de la página hayan terminado de cargar. Espera que el DOM se cargue por completo pero no espera recursos externos.
Puede causar tiempos de carga de página más lentos si se están cargando recursos pesados. Más rápido, ya que no espera que se carguen todos los recursos.
Solo se puede asignar una función. Se pueden asignar y ejecutar múltiples funciones en orden.
Compatible con todos los navegadores. Requiere biblioteca jQuery.
No se recomienda adjuntar oyentes de eventos, ya que puede causar problemas de rendimiento. Recomendado para adjuntar a los oyentes de eventos a DOM Elementos.

Cómo usar la "ventana.Método Onload () "en JavaScript?

El "ventana.Onload ()El método "se usa comúnmente en JavaScript para realizar acciones o ejecutar código después de que la página haya terminado de cargar.

Sintaxis

La siguiente sintaxis se utiliza para la ventana JavaScript ".Método de Onload ”:

ventana.onload = function ()
// código
;

O también puedes usarlo como:

función funcname ()
// código

ventana.onload = funcname ();

Ejemplo

Llame a la "ventana.Evento de Onload "con una función"cargando()"Para mostrar un mensaje alerta () en la carga de la página:

ventana.onload = function loading ()
alerta ("la página se carga correctamente");
;

La salida indica que se mostrará la función en el evento Onload después de cargar la página:

Cómo usar "$ (documento).Función Ready () "en JavaScript?

"$ (documento).listo()"La función es una parte importante de la biblioteca jQuery. Ejecuta el código JavaScript tan pronto como el DOM está preparado para la manipulación después de que el documento se haya cargado en el navegador.

Sintaxis

Use la sintaxis dada para la función Ready ():

$ (documento).Ready (function ()
// código
);

Ejemplo

Para usar el "$ (documento).Función Ready () ", primero agregue la biblioteca jQuery en la etiqueta:

Llame a la función lista para mostrar un mensaje de alerta mientras DOM está listo para manipular:

$ (documento).Ready (function ()
alerta ("la página se carga correctamente");
);

Producción

Eso se trata de la "ventana.Onload "y" $ (documento).Función Ready () "en JavaScript.

Conclusión

"ventana.encendido"Es un JavaScript"evento" mientras que la "$ (documento).listo()" es un "función"Específico para la biblioteca jQuery. Ambos se están utilizando para ejecutar el código JavaScript cuando la página finaliza la carga. La distinción/variación clave entre estos dos es que la "ventana.Onload ”espera cargar todos los activos en la página para terminar de cargar. Mientras que el "$ (documento).Ready () "espera a que el DOM se cargue por completo, pero no espera recursos externos. Esta publicación describió la diferencia entre la "ventana.Onload "y el" $ (documento).Ready () ”en JavaScript y su uso con ejemplos.