14 C
Jaipur
Sunday, November 29, 2020

Javascript Redirect – Linux Hint

Must read

Gaming laptop deal: save $390 on the Dell G5 15 in the early Cyber Monday sale

We've just spotted a fantastic gaming laptop deal over on the official Dell website for anyone looking for a solid first step into the...

Where to buy Oculus Quest 2 on Cyber Monday – and why are there no deals?

Looking for Oculus Quest 2 Cyber Monday deals? Unfortunately, we haven't really seen any across the Black Friday weekend. In fact, the VR headset...

See how iPhone XR deals came down to only £20 a month this Black Friday weekend

If you're in the market for a fairly priced iPhone, it's likely you'll have considered some iPhone XR deals before. While it's not quite...

Xbox Series X controllers are at their best price yet for Cyber Monday

If you're after a good Xbox Series X Cyber Monday deal, these Xbox Series X controllers should do just the trick. You'll find a...

Javascript is a web-oriented programming language. When using the web, you will often need to navigate through pages. When you click on any button, submit a form, or log in to any website, you get redirected to a different new page. Page redirection is an essential part of any website, but it is not only restricted to page navigation on a website. There can be multiple reasons to redirect the page, for example:

  • The old domain name is changed to a new domain
  • Submission and Authorization of a form
  • On the base of the browser or language of the user
  • Redirect from HTTP to HTTPS

This article explains a few different ways to redirect a page.

Syntax

The syntax for navigating to a page using javascript is as follows:

window.location.href = “url”

In this method, you simply provide the URL to which you want to redirect the user.

The syntax for another method of redirecting a user to a new URL is as follows:

window.location.replace(“url”) // or
window.location.assign(“url”)

In this functional syntax, you provide the URL to which you want to redirect, and whenever this function is called, you will be redirected to that specific URL.

Here, “replace” and “assign” do the same task but with a subtle difference. They both redirect to a new URL, but “replace” does not take the record of history and the user cannot go back to the old URL or previous page. Meanwhile, “assign” keeps the history record and allows the user to go back to the previous page.

We will now look at some examples of both syntaxes.

Examples

First, we will create an on-click function on a button.

<button onclick=“redirectFunction()”>Linuxhint</button>

This function will redirect the user to the website “https://www.linuxhint.com.”

function redirectFunction() {
window.location.href = “https://www.linuxhint.com”
}

Now, if the user clicks on the button, they will be redirected to linuxhint.com

In this next example, say, you want to redirect the user from an old domain to the new domain. For testing purposes, suppose the current address is the localhost, but whenever the user enters the URL of the localhost, the user gets redirected from the localhost to the new URL, which is linuxhint.com in this example. This is easier to do than you may think. To do this, simply use the syntax of the second redirect method:

window.location.replace(“https://www.linuxhint.com”)

Now, if the user enters the localhost URL, they will be redirected to linuxhint.com. But, if you look at the top-left button of the browser for going back to the previous page:

the button is dulled and the browser is not allowing us to go back to the previous page. However, if you want to keep this option for the user, you can use “assign” instead of “replace.”

window.location.assign(“https://www.linuxhint.com”)

And now, if you look at the top-left button of the browser for going back to the previous page:

The button is not dulled. You can go back to the previous page.

It is recommended to use “replace” instead of “assign,” here, because the purpose of redirecting to a new URL is that the old URL is not working or not available anymore.

Conclusion

This article explained a few different methods of redirection in javascript, along with real-life examples using these methods. In this article, you have learned how to navigate to a new page and how to redirect from the old URL to a new URL. You can learn more about javascript at linuxhint.com.

Source link

- Advertisement -

More articles

LEAVE A REPLY

Please enter your comment!
Please enter your name here

Latest article

Gaming laptop deal: save $390 on the Dell G5 15 in the early Cyber Monday sale

We've just spotted a fantastic gaming laptop deal over on the official Dell website for anyone looking for a solid first step into the...

Where to buy Oculus Quest 2 on Cyber Monday – and why are there no deals?

Looking for Oculus Quest 2 Cyber Monday deals? Unfortunately, we haven't really seen any across the Black Friday weekend. In fact, the VR headset...

See how iPhone XR deals came down to only £20 a month this Black Friday weekend

If you're in the market for a fairly priced iPhone, it's likely you'll have considered some iPhone XR deals before. While it's not quite...

Xbox Series X controllers are at their best price yet for Cyber Monday

If you're after a good Xbox Series X Cyber Monday deal, these Xbox Series X controllers should do just the trick. You'll find a...

Incredible Cyber Monday deal: save £1,877 on this 55-inch Alienware gaming OLED monitor

Dell has stolen the limelight this sales season with the Alienware 55-inch AW5520QF getting a major £1,877 price cut – and this stellar early...