difference between document ready and onload in jquery

difference between document ready and body onload in jQuery


The main differences are the $(document).ready() event called when your HTML document is loaded and DOM is ready and it's don't wait for your content and images etc. fully loaded but  window.onload()(<body onload="func();">) event is  wait for your content and images etc. fully loaded.


The $(document).ready() function is called only one time when your page is loading not for partial page rendering in that case you need to use pageLoad() function.

Document Ready function:-
We can call more than one document.ready() function in single page.
The document.ready() function is called when DOM is not fully loaded that means rest of images, css or other 3rd party reference on page.
It will not wait for the images, css or other 3rd party to get loaded.

Body Onload function:-
The body.onload() function, we can have only one body.onload() function.
The body.onload() function is called when everything fully loaded on the page like DOM, images and css or other 3rd party reference on page.
It will wait for the images, css or other 3rd party to get loaded.

The ready and load events:
1.      $(document).on('ready', handler)
2.      $(document).on('load', handler)

The ready and load functions: 
1.      $(document).ready(handler)

2.      $(document).load(handler)
ANIL SINGH

Hey! I'm Anil Singh. I author this blog. I'm Active Blogger, Programmer. I love learning new technologies, programming, blogging and participating the forum discussions more...
My Blogs - http://www.code-sample.com and http://www.code-sample.xyz
My Books - Google Amazon and Flipkart Book Store!

You Might Also Like
Post a Comment
www.code-sample.com/. Powered by Blogger.
ASK Questions
SQL Server NodeJs TypeScript JavaScript Angular SQL Server My Book