From what I have gathered, the former assigns the actual value of whatever that functions return statement would be to the onload property, while the latter assigns the actual function, and will run after the window has loaded. But I am still not sure. Thanks for anyone that can elaborate.

From what I have gathered, the former assigns the actual value of whatever that functions return statement would be to the onload property, while the latter assigns the actual function, and will run after the window has loaded. But I am still not sure. Thanks for anyone that can elaborate.

• javascript
• scripting

• 1 Yes, that's exactly the difference. – Sergio Tulentsev Commented Jan 12, 2012 at 4:20
• SInce you gave the correct definition, we don't really know what you're not sure about. Care to elaborate? – Ernest Friedman-Hill Commented Jan 12, 2012 at 4:22
• Well the book I am reading said there is a distinct difference, but to me it accomplishes the exact same thing. The function runs after the page loads, what is the point of using either one? – Andy Commented Jan 12, 2012 at 4:26
• @ErnestFriedman-Hill—The OP wants an answer of "yes" or "no" and if no, why. – RobG Commented Jan 12, 2012 at 4:27

3 Answers 3

window.onload = init();

assigns the onload event to whatever is returned from the init function when it's executed. init will be executed immediately, (like, now, not when the window is done loading) and the result will be assigned to window.onload. It's unlikely you'd ever want this, but the following would be valid:

function init() {
   var world = "World!";
   return function () {
      alert("Hello " + world);
   };
}

window.onload = init();

window.onload = init;

assigns the onload event to the function init. When the onload event fires, the init function will be run.

function init() {
   var world = "World!";
   alert("Hello " + world);
}

window.onload = init;

window.onload = foo;

assigns the value of foo to the onload property of the window object.

window.onload = foo();

assigns the value returned by calling foo() to the onload property of the window object. Whether that value is from a return statement or not depends on foo, but it would make sense for it to return a function (which requires a return statement).

When the load event occurs, if the value of window.onload is a function reference, then window's event handler will call it.

Good answers, one more thing to add:

Browser runtimes ignore non-object (string, number, true, false, undefined, null, NaN) values set to the DOM events such as window.onload. So if you write window.onload = 10 or any of the above mentioned value-types (including the hybrid string) the event will remain null.

What is more funny that the event handlers will get any object type values, even window.onload = new Date is a pretty valid code that will prompt the current date when you log the window.onload. :) But sure nothing will happen when the window.load event fires.

So, always assign a function to any event in JavaScript.