5 Ways To Redirect A Spider Web Page Using Javascript Together With Jquery

When an HTTP asking for i page automatically goes to unopen to other page in addition to then it is called a redirection. The redirection of a spider web page is used for different reasons e.g. redirecting to a different domain e.g. when y'all deed your website from i URL to unopen to other URL or redirecting to a to a greater extent than recent version of a page y'all are looking at it. There are many ways to redirect a spider web page in addition to different spider web technologies render different ways e.g. Java provides sendRedirect() in addition to forward() method for redirection. The redirection tin besides hold upward divided into 2 categories, customer side in addition to server side. In customer side, redirection customer is responsible for routing asking to unopen to other URL but inwards server side redirection, its server's chore to redirect to a novel page.

The jQuery in addition to JavaScript are by in addition to large used for customer side redirection in addition to in that location are a break of ways to redirect a spider web page using JavaScript In this tutorial, we'll attempt unopen to of the most pop in addition to mutual ways to redirect a spider web page using JavaScript in addition to jQuery.

How to redirect a spider web page using JavaScript

Before looking at the jQuery code, let's kickoff larn how to redirect a spider web page past times using evidently JavaScript. It provides several uncomplicated ways to accomplish this task without loading an external JavaScript library similar jQuery.

Redirection using window.location.href of Javascript

The most mutual way to redirect an URL using JavaScript is merely setting the href attribute of the window.location object. This simulates normal navigation to a novel page. I don't think whatever task tin hold upward simpler than this, merely assign a novel URL. For example, if y'all are redirecting URL Influenza A virus subtype H5N1 to URL B in addition to then merely seat the URL B hither equally shown inwards the next example:

window.location.href="http://newURL.com";
 

Tip: You should cry back that window.location.href loads page from browser's cache in addition to does non ever post the asking to the server. So, if y'all accept an one-time version of the page available inwards the cache in addition to then it volition redirect to in that location instead of loading a fresh page from the server.

Redirection using replace() function

Another way to redirect to a spider web page inwards jQuery is past times using the replace() business office of the window.location object. This method removes electrical current URL from the history in addition to replaces it amongst a novel URL. Here is an instance of how to exercise this business office for redirection:

window.location.replace("url"); 
 

Tip: Use the replace() method if y'all desire to desire to redirect to a novel page in addition to don't allow the user to navigate to the master copy page using the dorsum button.

Redirection using window assign() function

You tin besides exercise the window.location.assign() business office to redirect a spider web page using JavaScript. This business office adds novel URL to the history stack in addition to redirected to the novel URL, which means, dissimilar replace() business office y'all tin exercise the dorsum push to become dorsum to the master copy document. Here is how y'all tin exercise this method to redirect to a novel url

window.location.assign("url"); 

Tip: Use the assign() method for redirection if y'all desire to allow the user to exercise the dorsum push to become dorsum to the master copy document.

Redirection using navigate function

This business office is same equally window.location="url" in addition to it besides loads the page from the cache instead of take requesting it from the server. Here is an instance to exercise the navigate() business office for redirection to a novel page

window.navigate("page.html");

This code is similar to the kickoff method in addition to the page volition hold upward loaded from the cache if available instead of sending a novel asking to the server.

How to redirect spider web page using jQuery

The jQuery API besides allows y'all to redirect a spider web page to unopen to other URL inwards merely i trace of piece of employment of code. Though this is non the ideal way of using jQuery in addition to but since nosotros all exercise jQuery for different needs inwards a spider web project, it makes feel to leverage it for whatever characteristic nosotros can. You tin exercise the attr() business office of jQuery to redirect a spider web page equally shown below:

var url = "http://google.com"; $(location).attr('href',url);

There is a slight departure inwards using attr() vs window.location.href of JavaScript. The $(location).attr('href', url) volition asking a fresh page from server, land window.location.href loads pages from cache.

Here is a consummate spider web page which redirects to unopen to other URL using jQuery:

<html>    <head>       <title>How to redirect a webpage using jQuery</title>    </head>    <body>       <h2>Redirecting to unopen to other URL ..</h2>        <script src="http://code.jquery.com/jquery-1.6.2.min.js"></script>       <script>          $(document).ready(function() {                     var url = "http://javarevisited.blogspot.com";           $(location).attr('href',url);                    });       </script>    </body> </html> 

in addition to hither is the output of this spider web page when y'all run it on a spider web browser e.g. mesh explorer, chrome or edge:

You tin encounter that page is redirecting, i time the redirect volition hold upward complete, the URL in addition to page championship volition besides hold upward replaced past times the target URL.  See Head First jQuery to larn to a greater extent than virtually jQuery in addition to its powerful API.

How to redirect to the previous page

Another instance of redirection is going to the previous page, hither are unopen to of the mutual way to become to the previous page using JavaScript's window object:

window.history.back(); // Simulates a dorsum push click window.history.go(-1); // Simulates a dorsum push click window.history.back(-1); // Simulates a dorsum push click

All iii methods imitate a dorsum push click programmatically. You tin exercise whatever of the methods y'all desire to use.


That's all virtually how to redirect a spider web asking to unopen to other spider web page using JavaScript in addition to jQuery. As y'all accept seen in that location are multiple ways to redirect but in that location is subtle differences betwixt them e.g. $(location).attr('href', url) telephone weep upward of jQuery volition opened upward a fresh page from the server, but the Javascript window.location.href loads pages from cache. Similarly, the window.location.assign(url) adds novel URL to the document history in addition to redirected to the novel URL but window.location.replace("URL") removes electrical current URL from history in addition to replaces it amongst a novel URL.

Further Reading
The Complete jQuery Course: From Beginner To Advanced!
Up in addition to Running amongst jQuery
books)

How to acquire electrical current URL, Parameters, in addition to Hash using jQuery? (solution)

How to alter to a greater extent than than i chemical gene inwards i line? (example)

jQuery Hello World Example (program)

Free jQuery eBooks in addition to PDFs (download)

How to exercise to a greater extent than than i jQuery UI DatePicker inwards JSP page? (example)

How to create tab-based UI using jQuery? (example)

Top xx jQuery Interview Questions for Java Web Developers (list)

How to check/uncheck checkboxes inwards jQuery (solution)

How to download jQuery dynamically inwards a spider web page? (solution)

Thanks for reading this article. If y'all similar this article in addition to then delight portion amongst your friends in addition to colleagues. If y'all accept whatever interrogation or feedback in addition to then delight drib a comment.