Welcome to the JavaScript Tutorials, we have already covered JavaScript event, JavaScript void and JavaScript function. In fact we have covered many more topics, and you can find it in our JavaScript tutorials. Today we will see what is a JavaScript redirect page and how to use the JavaScript redirect page to direct your user to a new web page, or a domain.
The JavaScript redirect page will help you to inform your visitors of any change of the web location or pages. To do so, you need to use a JavaScript redirection.
JavaScript redirect page – Why to use it?
JavaScript redirect page can be used in many ways, let’s see how it will help you with major scenarios:
- Migration – May be you were using the free hosted website, and you have got a new website or created a blog. Now you want more control of your content or want to monetize your blog. But don’t want to lose the traffic of a free hosted website as well. Here, JavaScript redirect will help you hold those visitors.
- Domain name changed – If you don’t like your existing website domain name or it is similar to other bad neighbors, and you have got a new blog. Again, you can use the JavaScript redirect page to hold the traffic.
- Content – you can use your old free domain to divert visitors to your new web site’s content. For example, I have a website called sharplesson@blogspot.in, then I can redirect visitors to read more content on my new website .
JavaScript redirect page – Example
Now we will see, how JavaScript redirect page can be used to direct your visitors. We will use two examples:
- Redirect the visitor with user inputs.
- Redirect the visitor with a message.
Example -1
We will see when user will click the button, it will be directed to the sharplesson’s website. To redirect, we have used a custom function, you can put any name instead of ‘SharpLessonRedirect ()’. When a reader will click the button, it will call the function SharpLessonRedirect (). The ‘window.location’ will open the web page URL ‘’.
<html>
<head>
<script type="text/javascript">
<!--
function SharpLessonRedirect() {
window.location="";
}
//-->
</script>
</head>
<body>
<p>Click the button and you will be see the example of redirection.</p>
<form>
<input type="button" value="Come & Redirect" onclick="SharpLessonRedirect();" />
</form>
</body>
</html>
Now we will see two output’s:
First output will be:
When the reader will click the above ‘ Come & Redirect’, then it will open the sharplesson’s website:
Second output will be:
Yes, finally your small code have redirected the page to a sharplesson website.
Example 2
In this example we will show a message to our readers, and it will redirect the reader to the new location in a few seconds. We have used ‘SharpLessonRedirect ()’, and setTimeout () to set the time delay to 6 seconds.
<html>
<head>
<script type="text/javascript">
<!--
function SharpLessonRedirect() {
window.location="";
}
document.write("Wait for 6 seconds! And you will be redirected");
setTimeout('SharpLessonRedirect()', 6000);
//-->
</script>
</head>
<body>
</body>
</html>
When you will run this program, you will see two results:
The first result will be:
It will show the above result first, and then it will redirect to:
The second result will be:
Here, again you got the sharplesson.com as a redirected url.
Points to Remember
- We have used ‘SharpLessonRedirect ()’ function. You can have any name, like yours or pet as well.
- We have used setTimeout () with two arguments. The first argument is ‘SharpLessonRedirect ()’ which will come into action after the delay time. And the second argument is time in milliseconds, we have set 6000 seconds.
Conclusion
We have just shown the importance of the JavaScript redirect page and how to use it in different ways. Just practice it to understand the use of JavaScript redirect.