Main difference between window.location.href and window.onload() in javascript?

Question

I'm using window.location.href to load a page and now I have switched over to window.onload() function, but the page does not load some contents.

window.location.href = $(this).val(); is the code I'm using.

How can I write it using window.onload() function?

Why do you want to switch to `window.onload()` if it is working? — HTTP, Jul 24 '13 at 09:14
Are you refering to jquery load method `$(window).load()` or what? — A. Wolff, Jul 24 '13 at 09:33

score 6 · Accepted Answer · answered Jul 24 '13 at 09:14

6

window.onload is a property to which you can assign a function that will run when the page has finished loading. It doesn't have a function assigned to it by default, so you can't call it unless you first assign a function to it. It has nothing to do with causing the browser to go to a different URL.

Assigning an onload function directly has also been superseded by addEventListener.

You could assign a function to it that would set location.href to a new value

// Don't do this
function redirect() {
    location.href = "http://example.com";
}
addEventListener('load', redirect);

… but if you are doing that as soon as the page loads then you should be using an HTTP redirect instead.

answered Jul 24 '13 at 09:14

Quentin

914,110
126
1,211
1,335

+1, and I can't even see how you could mistake their names... – Dave Chen Jul 24 '13 at 09:15
`window.onload()` is an event, I don't what you meant by property – Jul 24 '13 at 09:16
It's an event property. – Dave Chen Jul 24 '13 at 09:17
2

@Akam — `load` is an event. `window` is an object. `onload` is a property on that object to which you can assign a function that will act as an event listener for that event. – Quentin Jul 24 '13 at 09:17
Hope I won't get shot down if I reference some [MSDN](http://msdn.microsoft.com/en-us/library/ie/cc197055(v=vs.85).aspx). – Dave Chen Jul 24 '13 at 09:18
I knew that onload can be attached to `, , , , <img/>, <input type="image"/>, <link/>, <script>, <style>` and `window` but why a property? generally we call this window event...</script> – Jul 24 '13 at 09:20
1

@Akam — Because [that is what they are called in JavaScript](http://www.ecma-international.org/ecma-262/5.1/#sec-4.3.26). And `window.onload` is not an event. `load` is an event. – Quentin Jul 24 '13 at 09:21
that link do not provide an answer to contrast that window.onload is a property not an event, I will research and notify you also, thanks for your effort :) – Jul 24 '13 at 09:24
I can't find any reference call `window.onload()` property, I knew any thing attached to an object will be a property, but according to [GlobalEventHandlers.onload](https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers.onload) and [adding to window.onload event?](http://stackoverflow.com/questions/15564029/adding-to-window-onload-event) and [Handling_events_with_JavaScript](http://www.w3.org/wiki/Handling_events_with_JavaScript) `window.onload()` is called an event – Jul 24 '13 at 10:08
`window.onload()` is not a property, it is a call to a function stored in a property of an object. *knew any thing attached to an object will be a property*, no the thing attached to the object is the value of the property. The property is where it is attached to. `window.onload` is where it is attached to, `onload` is a property of the `window` object. – Quentin Jul 24 '13 at 10:45
GlobalEventHandlers.onload says that it is *An event handler for the load event of a window.*, not *An event*. Your second example *adding to window.onload event?* is a question asked by someone using the wrong terminology. Your third example is a wiki page, it isn't a specification and it makes some terminology mistakes. – Quentin Jul 24 '13 at 10:45

score 2 · Answer 2 · answered Jul 24 '13 at 09:14

2

Both are entirely different concepts

The window.onload event is a standard event in the DOM,while window.location.href returns the location of the current page.

answered Jul 24 '13 at 09:14

Arun Bertil

4,598
4
33
59

HIRA THAKUR · Answer 3 · 2013-07-24T09:38:11.703

Both of them are used in totally different context.

onload is an event

location.href is a property

*window.onload*

This event is used if you want to take some action the moment page content gets loaded entirely(this includes all your elements,images etc etc).So you can assign any function according to your functionality if your project demands some action after content is loaded.

*window.location.href*

This is used for REDIRECTION purpose.I will use it only when I want my user to go to some different page.

In your Context It is pointless to execute window.location.href on window.onload event.If you are not allowing user to spend some time on the onloading page,then I would suggest to directly load the page that you are including in

window.location.href="this url shoulod be loaded directly instead";

why take a longer route when the shorter one is so efficient??

thank you..clear explanation. I understood thnk u – Ajmal Jul 24 '13 at 17:05 — Ajmal, Jul 24 '13 at 17:05

score 0 · Answer 4 · answered Jul 24 '13 at 09:20

window.location.href="url" is what you would call within a javascript function to load some other page(url). It does exactly the same thing what is done when you are clicking a hyperlink on a normal web page.

window.onload() is a an event handler; which you may use to do several things with javascript when an HTML page is loaded. In other words, this will be called, when the page loading event takes place.

These are two different things.

For an example, you can use window.location.href="url" to go to another page, and within that new page you can use window.onload() event handler to execute something you want to happen when that page is loaded.

eg:

<script>

window.onload=function(){
  document.write("hi! this text was written when the page was being loaded");
}

</script>

Thanks.

Main difference between window.location.href and window.onload() in javascript?

4 Answers4