JavaScript Redirect Page To URL

In JavaScript to redirect the current page to another page we have the two option.

1. window.location
2. document.location

As per the MDN window.location and document.location both are the read only Location object. window.location provide the many information related to the URL.

window.location

window.location have the some useful properties and object that will help us to get the information related to the URL.

window.location.href returns the URL of the current page.

window.location.assign() methods will helpful to redirect the current page to another page.

window.location.protocol returns the web protocol that are currently used by the website like the http:// or https://.

window.location.pathname returns the full path and file name of the current page.

window.location.hostname returns the domain name of the web host.

As per my knowledge document.location and window.location both are the same. If we check the condition like this document.location == window.location it will return the true. Because both are return the current object of the Location which are same.

Now days, all modern browser are trying to map document.location to the window.location.

I recommend you to use the window.location for cross browser safety.

Navigate to another page:

If you want to simply redirect the current page to another page than you can use the below one of the methodology to do that.

window.location = "http://www.javascripthive.info"; or
window.location.assign("http://www.javascripthive.info");

Reload the current page from the server:

If you want to reload the page forcefully from the server with new content than you can use the reload method of the window location class.

window.location.reload(true);

Redirect page after some time:

If you want to redirect the page after some time or you want to redirect the page with display a specific message to user and redirect the page than below example going to help you. Just use the setTimeout() method of the JavaScript to implement this type situation.

function RedirectPage() {
    window.location.assign("http://www.javascripthive.info");
}
setTimeout("RedirectPage()", 10000);

JavaScript redirect the page with parameter:

If you want to redirect the page with the some parameters than simply add the parameters add the end of the URL like the query parameter.

function RedirectPage() {
    window.location.assign("http://www.javascripthive.info/?s=JavaScript");
}
setTimeout("RedirectPage()", 10000);

JavaScript handle page redirect event:

Many time we want to display the alert message to user, before they are going to close the current page or redirect to another page. For handle that situation we can register or override the onbeforeunload() method of the window class. It will notify or called the our registered function before the closing the page, browser or redirect the page to another page.

window.onbeforeunload = function (e) {
    return "Page is redirecting!!!";
}
function RedirectPage() {
    window.location.assign("http://www.javascripthive.info/?s=JavaScript");
}
setTimeout("RedirectPage()", 10000);

Feel free to add your comments below.

Happy Coding!!!

🙂