"window.onload" vs "$("document").ready()


What's the difference between window.onload and $("document").ready")?

Why should I use $("document").ready") instead?


Very contradicting topic @heybye44, i was stumboled upon that to when i first started to learn jQuery.

So the diffrence


window.onload (the load event) runs after everything has finished loading. Images, Flash, and some scripts, but usually not stylesheets. Use this for code that should run only when the page won't change any more. More descripton Here.


jQuery document.ready will run your code when the HTML is all ready, but before images and other resources have finished. This is the earliest possible time that you can change the DOM with JavaScript, so it's widely used. In Modern Browsers like google chrome it is replaced by DOMContentLoaded. Again more info Here.


You want to use $(document).ready() when you have large files of images,ads,scripts,etc.. so it dosent consume a large amount of time. But you want to use window.onload(), when you have less amount of images,ads,scripts,etc.. to make sure you load properly. In codecademy they use $(document).ready() function since you wont work with huge files of images,scripts,ads,etc..

Hope you understand now! Have healthy learning