Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
 
  • Difference between window.onload and document ready

    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 1.18k
    Comment on it

    There are some minor difference between the two but it can effect with lots of confusion between to many of us.

    window.load - It is fired when everything on the page is loaded.  By everything I mean that when the DOM is loaded, when all the related images to that page is ready and the CSS is ready and all the attached resources are ready.
    After waiting for all these resources to load, it will take a lot of time to fire the window.load. So, by using this we have to wait for the all the resources to load and modifies the page or hooks up event handlers, etc...
    Syntax : 

    window.onload = function(e){ 
       console.log("Window is loaded !!");
    }

    $(document).ready() - It fires as soon as the DOM is ready for manipulation. By this I mean that when my HTML page is ready the events and all the thing inside document ready is fired, it will not wait for other resources to load such as images as it will take a longer time to load into the browser as there are manty  images which takes a longer than to load into the browser.
    Secondly, when all the object in the HTML page is been parsed and initialized and all the script is loaded, it will fire the events.
    It is a very useful approach to use document ready as If we want to differ some part of the web page from browser to browser as after loading DOM element we can check the browser and display the particular thing for each one.


    The $(document).ready() uses different mechanism to detect when the DOM is ready in its 1.6.x version, the preferred one is when the DOM content is loaded.
    But it is supported by some smart browsers.

    Syntax : 

    $(document).ready(function(){
       console.log("document is loaded !!");
    })
    

    Shortcut for this syntax is :

    $(function(){
       console.log("document is loaded !!");
    })
    

    Both of these events will fire only once per when the page load.

     

     

 0 Comment(s)

Sign In
                           OR                           
                           OR                           
Register

Sign up using

                           OR                           
Forgot Password
Fill out the form below and instructions to reset your password will be emailed to you:
Reset Password
Fill out the form below and reset your password: