03Nov 2011 8 Comments */?>

Diferencia entre $(document).ready y $(window).load en jQuery

Categorías: JQuery, Tutoriales - Tags: ,

Hoy les voy a explicar la principal diferencia entre $(document).ready y $(window).load , funciones esenciales a la hora de usar jQuery en tus programas.

1
2
3
$(document).ready(function(){
//todo el código
});

El código que ven más arriba se suele usar la mayoría del tiempo y en casi todos lados lo mencionan como la mejor manera de ejecutar nuestro código después del que el DOM esta listo.

Entonces para que se necesita $(window).load() ?

Yo hasta ahora lo he utilizado para trabajar con imágenes. Cuando se necesita manipular imágenes para por ejemplo alinearlas o se necesita obtener el width y height de las mismas necesitaremos sí o sí utilizar $(window).load().
Con $(document).ready() no podrás hacer eso si el usuario no tiene cargadas las imágenes en la cache o en otras palabras tu código siempre fallaría con nuevos usuarios.

A diferencia de este último $(window).load() ejecutará el código una vez hayan cargado todas las imágenes. A simple vista no se observa diferencia ninguna en cuanto a tiempo, pero si alguna vez tuvieron que manipular imágenes cuando carga una página sabrán a que me refiero.

1
2
3
$(window).load(function(){
// Código ejecutado después de que se carguen la imágenes.
});

Saludos!!!

Damián Logghe

Programador freelancer y emprendedor en sueños. Contento de ser mi jefe y poder hacer lo que me gusta. WordPress es mi principal fuente de ingreso y me escribo tanto para ayudar como para tener una guia de memoria. Quieres contratarme? Déjame un mensaje.

More Posts - Website

Follow Me:
TwitterFacebookLinkedInGoogle Plus