1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

Do u know the difference between jquery $(document).ready and $(window).load ???

Discussion in 'jQuery' started by kostas13ioannou, Dec 21, 2015.

  1. #1
    I thought, that there is no difference between these two. That both work and do stuff,
    when the page has loaded. WRONG!!!
    $(document).ready work when the DOM is ready.
    That means that can be executed even when the pictures have NOT been loaded, cause the DOM is ready (the structure of the page and its elements)
    But, when you need to do something, when EVERYTHING has loaded,
    comes the $(window).load.
    I found it out, when i needed to pass a javascript variable at the start of the page, and do something with that. I made it with $(document).ready and $(window).load

    I found also this relative article. Check it out!
    https://4loc.wordpress.com/2009/04/28/documentready-vs-windowload/
     
    kostas13ioannou, Dec 21, 2015 IP
  2. deathshadow

    deathshadow Acclaimed Member

    Messages:
    9,732
    Likes Received:
    1,998
    Best Answers:
    253
    Trophy Points:
    515
    #2
    IT is a distinction you should know in JS BEFORE you even think about going the herpa-freaking-derp route of the fat bloated idiotic BS known as jQuery... To that I'd also add that if all your JS is doing is manipulating the DOM, you MAY be better off not even waiting that long and simply run the script right before </body> as by then the DOM will be built. It may hang render, but can result in a placebo effect of the page seeming to load faster/smoother.

    A LOT of times people hook document.onready or window.onload for no good reason other than to make the page load slower and uglier. Other times people will NOT use them for things that won't work consistently or result in a slower pageload by using them instead of putting it into body.

    It all comes down to how are you hooking into the page, and what you are doing with those hooks.

    But these days people seem to dive for the frameworks to do things before they even know the slightest damn thing about using the underlying language -- which is why most people using frameworks aren't qualified to say if that approach is providing actual benefits, or if they simply lack the knowledge to understand that they are in fact making more work for themselves.
     
    deathshadow, Dec 21, 2015 IP
  3. elisagrace

    elisagrace Peon

    Messages:
    13
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    1
    #3
    Hey,
    • document.ready runs when the DOM is ready, means all elements are there to be found/used, but not necessarily all content.

    • window.onload fires later or at the same time in the worst/failing cases when images are loaded, so if you're using image dimensions for example, you often want to use this instead.
    Code:-

    $(document).ready(function() { // executes when HTML-Document is loaded and DOM is ready alert("document is ready");});

    $(window).load(function() { // executes when complete page is fully loaded, including all frames, objects and images alert("window is loaded");});
     
    elisagrace, Jan 5, 2016 IP