Trying reload the current page without the fragment identifier (i.e. hash symbol #) and using the following bit of code to do so which functions correctly:
var path = window.location.href.replace(/(\#.*)/,'');
window.location = path;
I'm also aware that the above second line could read window.location.href = path;
which brings me to the next part.
Before arriving at the above code we tried:
var path = window.location.href.replace(/(\#.*)/,'');
window.location.href = path;
window.location.reload();
However that didn't work for us as the href
value wasn't seeming to be set and I feel that reload()
was calling before or instead of the href = path
bit.
This got me curious, where does the reload()
function for window.location
get its value from to reload the page?
If I click around a page jumping between fragment identifiers (perhaps a table of contents) then the address bar updates accordingly and when called, window.location.reload()
will do so with the correct fragment. Yet if I manually type something in the address bar and then call the reload()
function it will not load with my manual entry but rather the last 'puter defined' value.
My guess is the user agent (in this particular case Chrome 44) is listening and updating the value which each interaction with the DOM or within the window. I checked out the HTML5 spec and the MDN Location.reload() docs for information and either it wasn't there or I'm too dense to find/understand it.
Can anyone explain to me where reload()
gets it's value and how it is updated through a users interaction with a page?
What is the exact difference between using window.location = path
and window.location.href = path
in this scenario?
Trying reload the current page without the fragment identifier (i.e. hash symbol #) and using the following bit of code to do so which functions correctly:
var path = window.location.href.replace(/(\#.*)/,'');
window.location = path;
I'm also aware that the above second line could read window.location.href = path;
which brings me to the next part.
Before arriving at the above code we tried:
var path = window.location.href.replace(/(\#.*)/,'');
window.location.href = path;
window.location.reload();
However that didn't work for us as the href
value wasn't seeming to be set and I feel that reload()
was calling before or instead of the href = path
bit.
This got me curious, where does the reload()
function for window.location
get its value from to reload the page?
If I click around a page jumping between fragment identifiers (perhaps a table of contents) then the address bar updates accordingly and when called, window.location.reload()
will do so with the correct fragment. Yet if I manually type something in the address bar and then call the reload()
function it will not load with my manual entry but rather the last 'puter defined' value.
My guess is the user agent (in this particular case Chrome 44) is listening and updating the value which each interaction with the DOM or within the window. I checked out the HTML5 spec and the MDN Location.reload() docs for information and either it wasn't there or I'm too dense to find/understand it.
Can anyone explain to me where reload()
gets it's value and how it is updated through a users interaction with a page?
What is the exact difference between using window.location = path
and window.location.href = path
in this scenario?
2 Answers
Reset to default 3The location (value) only changes after a successful navigation! In other words, the location
instance represents the currently loaded page (including the fragment).
Assigning a new value to window.location.href
(re)loads a page.
So when you call window.location.href = path;
the browser wants to load the new URL (the one without the #). But if you immediately call window.location.reload();
it's like saying "No, wait! Reload the current page (the one with the #)".
If you want to remove the "#" part of the url you have to explicitly set:
window.location.hash = ""
and then call window.location.reload().
window.location = path
is nothing more than syntactic sugar for window.location.href = path
.