Latest

Javascript Redirect – Linux Hint

Pinterest LinkedIn Tumblr

Javascript is a web-oriented programming language. When utilizing the net, you’ll typically must navigate by pages. Once you click on on any button, submit a type, or log in to any web site, you get redirected to a distinct new web page. Web page redirection is a vital a part of any web site, however it isn’t solely restricted to web page navigation on a web site. There could be a number of causes to redirect the web page, for instance:

  • The outdated area title is modified to a brand new area
  • Submission and Authorization of a type
  • On the bottom of the browser or language of the person
  • Redirect from HTTP to HTTPS

This text explains a number of other ways to redirect a web page.

Syntax

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

window.location.href = “url”

On this methodology, you merely present the URL to which you wish to redirect the person.

The syntax for an additional methodology of redirecting a person to a brand new URL is as follows:

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

On this purposeful syntax, you present the URL to which you wish to redirect, and at any time when this operate known as, you’ll be redirected to that particular URL.

Right here, “exchange” and “assign” do the identical activity however with a refined distinction. They each redirect to a brand new URL, however “exchange” doesn’t take the report of historical past and the person can not return to the outdated URL or earlier web page. In the meantime, “assign” retains the historical past report and permits the person to return to the earlier web page.

We are going to now take a look at some examples of each syntaxes.

Examples

First, we’ll create an on-click operate on a button.

This operate will redirect the person to the web site “https://www.linuxhint.com.”

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

Now, if the person clicks on the button, they are going to be redirected to linuxhint.com

Javascript Redirect – Linux Hintknowledge:;base64,” alt=”” width=”764″ top=”290″ data-lazy-=”” data-lazy-src=”http://31.220.61.170/wp-content/uploads/2020/10/Javascript-Redirect-–-Linux-Trace.png” />

On this subsequent instance, say, you wish to redirect the person from an outdated area to the brand new area. For testing functions, suppose the present handle is the localhost, however at any time when the person enters the URL of the localhost, the person will get redirected from the localhost to the brand new URL, which is linuxhint.com on this instance. That is simpler to do than you could suppose. To do that, merely use the syntax of the second redirect methodology:

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

Now, if the person enters the localhost URL, they are going to be redirected to linuxhint.com. However, when you take a look at the top-left button of the browser for going again to the earlier web page:

Javascript Redirect – Linux Hintknowledge:;base64,” alt=”” width=”765″ top=”307″ data-lazy-=”” data-lazy-src=”http://31.220.61.170/wp-content/uploads/2020/10/1603614429_12_Javascript-Redirect-–-Linux-Trace.png” />

the button is dulled and the browser shouldn’t be permitting us to return to the earlier web page. Nevertheless, if you wish to hold this selection for the person, you need to use “assign” as a substitute of “exchange.”

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

And now, when you take a look at the top-left button of the browser for going again to the earlier web page:

Javascript Redirect – Linux Hintknowledge:;base64,” alt=”” width=”764″ top=”302″ data-lazy-=”” data-lazy-src=”http://31.220.61.170/wp-content/uploads/2020/10/1603614429_234_Javascript-Redirect-–-Linux-Trace.png” />

The button shouldn’t be dulled. You may return to the earlier web page.

It is strongly recommended to make use of “exchange” as a substitute of “assign,” right here, as a result of the aim of redirecting to a brand new URL is that the outdated URL shouldn’t be working or not out there anymore.

Conclusion

This text defined a number of totally different strategies of redirection in javascript, together with real-life examples utilizing these strategies. On this article, you will have realized how one can navigate to a brand new web page and how one can redirect from the outdated URL to a brand new URL. You may study extra about javascript at linuxhint.com.

what is redirection in linux,shell script redirect output to file,bash redirection,bash pipe,bash redirect stderr,learn bash in,bash programming cheat sheet pdf,bash file extension,bash greg,bash faq greg's wiki,bash operator