JavaScript(JS) 页面重定向(window.location)

可能遇到过这样的情况:单击一个URL到达一个页面X,但在内部却被指向另一个页面y。这是由于页面重定向造成的。这个概念不同于JavaScript页面刷新。本文主要介绍JavaScript(JS) 页面重定向。

1、使用页面重定向的原因

将用户从原始页面重定向的原因可能如下:

1)正在移动到一个新的域名。在这种情况下,可能希望将所有访问者引导到新站点。在这里,可以维护的旧域名,但将一个页面与页面重定向,以便所有旧域名访问者可以来到新域名。

2)已经构建了基于浏览器版本或它们的名称或可能基于不同国家的各种页面,可以使用客户端页面重定向,而不是使用服务器端页面重定向,以便将用户引导到适当的页面上。

3)搜索引擎可能已经对页面进行了索引。但是,当你转移到另一个域名时,不希望失去通过搜索引擎访问你的访问者。因此可以使用客户端页面重定向。但请记住,这不能欺骗搜索引擎,它可能导致你的网站被禁止。

2、页面重定向用法

在客户端使用JavaScript进行页面重定向非常简单。要将站点访问者重定向到一个新的页面,需要添加代码如下,

<html>
   <head>
      <script type = "text/javascript">
            function Redirect() {
            //重定向代码
               window.location = "https://www.cjavapy.com";
            }
      </script>
   </head>
   <body>
      <p>点击下面的按钮,将被重定向到主页。</p>
      <form>
         <input type = "button" value = "点击重定向" onclick = "Redirect();" />
      </form>
   </body>
</html>

可以在将站点访问者重定向到新页面之前向他们显示适当的消息。这将需要一点时间延迟来加载一个新页面。下面的示例展示了如何实现相同的功能。这里setTimeout()是一个内置的JavaScript函数,它可以用于在给定的时间间隔后执行另一个函数。

例如,

<html>
   <head>
      <script type = "text/javascript">
            function Redirect() {
               window.location = "https://www.cjavapy.com";
            }            
            document.write("将在10秒后被重定向到主页。");
            setTimeout('Redirect()', 10000);
      </script>
   </head>
   <body>
   </body>
</html>

针对不同的浏览器访问者重定向到不同的页面。

例如,

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

推荐阅读
cjavapy编程之路首页