What is the difference between Window.load and document.readyState

Question

I have one question; In my ASP.NET MVC web application have to do certain validation once page and all controls got loaded.

In Javascript I was using below line of code for calling a method:

window.load = JavascriptFunctionName ; 

Someone from my team asked me not used above line of code, instead use JQuery to do the same:

 document.attachEvent("onreadystatechange", function() {
        if (document.readyState === "complete") {
            CheckThis();

        }
    });

Please help me in understanding what is the difference between two. When I tested by keeping alert in both jQuery check is executing first and calling the CheckThis function where as window.load is taking some time and executing after it. Please suggest

Answer 1

window.load - This runs when all content is loaded, including images.

document.ready - This runs when the DOM is ready, all the elements are on the page and ready to do, but the images aren't necessarily loaded.

Here's the jQuery way to do document.ready:

$(function() {
  CheckThis();
});

If you wanted to still have it happen on window.load, do this:

$(window).load(function() {
  CheckThis();
});