JavaScript – 页面重定向

什么是页面重定向？

您可能遇到过这样的情况：您单击了一个URL以到达页面X，但内部却重定向到了另一个页面Y。这是由于 页面重定向 。这个概念不同于 JavaScript页面刷新。

有各种各样的原因为什么要重定向到原始页面上的用户。我们列出了一些原因−

您不喜欢您的域名，您正在移到一个新的域名。在这种情况下，您可能希望将所有访问者都引导到新站点。在这里，您可以保留旧域名，但放置一个具有页面重定向的单个页面，使您的所有旧域名访问者都可以来到您的新域名。
您已经根据浏览器版本或名称或者基于不同国家建立了多个页面，那么您可以使用客户端页面重定向，而不是使用服务器端页面重定向，将用户定位到相应的页面。
搜索引擎可能已经索引了您的页面。但是，当移动到另一个域时，您不想失去通过搜索引擎进入的访问者。因此，您可以使用客户端页面重定向。但是请记住，这不要用来欺骗搜索引擎，它可能导致您的网站被禁止。

页面重定向是如何工作的？

页面重定向的实现如下。

示例1

使用JavaScript在客户端很容易进行页面重定向。要将您的网站访问者重定向到新页面，您只需要在head部分中添加以下行。

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

   <body>
      <p>点击以下按钮，您将被重定向到主页。</p>

      <form>
         <input type = "button" value = "重定向到主页" onclick = "Redirect();" />
      </form>

   </body>
</html>

输出

JavaScript - 页面重定向

示例2

在重定向用户到新页面之前，您可以向您的网站访问者显示适当的消息。这需要一定的时间延迟来加载新页面。以下示例显示了如何实现此操作。此处 setTimeout() 是可以用于在给定的时间间隔后执行另一个函数的内置JavaScript函数。

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

   <body>
   </body</html>

输出

JavaScript - 页面重定向

示例3

以下示例显示了如何根据用户的浏览器将您的网站访问者重定向到不同的页面。

<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>