Home >Web Front-end >JS Tutorial >Tutorial on implementing page redirection function using JavaScript_Basic knowledge

Tutorial on implementing page redirection function using JavaScript_Basic knowledge

WBOY
WBOYOriginal
2016-05-16 15:56:521184browse

What is page redirection?

When you click on a URL to visit a web page X, but internally you are directed to another page Y, simply because the page redirects. The concept is different from JavaScript page refresh .

There may be various reasons why you want to redirect from the original page. A few reasons listed below:

  • If you don’t like your domain name, you can redirect to a new one. At the same time, direct all visitors to the new website. In this case, you can keep the old domain name but put a page-to-page redirect so that all visitors to the old domain name can come to the new domain name.
  • Browser-based versions, or pages with different names, can also be based on different countries. Instead of using server-side page redirection, you can use the client-side page to redirect the logged-in user to the corresponding page.
  • Search engines may have indexed the new page. However, when moving to another domain name, then don't like losing visitors coming through search engines. Therefore, you can use redirection of client pages. But remember, this shouldn't be done to make search engines fools, otherwise, it could get the site banned.

How does page redirection work?
Example 1:

This redirection of client-side pages using JavaScript is very simple. To redirect website visitors to a new page, just add a line in the head section as follows:

<head>
<script type="text/javascript">
<!--
  window.location="http://www.newlocation.com";
//-->
</script>
</head>

Example 2:

Can display corresponding information to website visitors before redirecting them to a new page. This will require a bit time delay to load the new page. Here is simple example to achieve the same:

<head>
<script type="text/javascript">
<!--
function Redirect()
{
  window.location="http://www.newlocation.com";
}

document.write("You will be redirected to main page in 10 sec.");
setTimeout('Redirect()', 10000);
//-->
</script>
</head>

The setTimeout() here is a built-in JavaScript function that can be used to execute another function after a given time interval.
Example 3:

The following is an example of redirecting visitors to different pages based on their browser:

<head>
<script type="text/javascript">
<!--
var browsername=navigator.appName; 
if( browsername == "Netscape" )
{ 
  window.location="http://www.location.com/ns.html";
}
else if ( browsername =="Microsoft Internet Explorer")
{
  window.location="http://www.location.com/ie.html";
}
else
{
 window.location="http://www.location.com/other.html";
}
//-->
</script>
</head>


Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn