开发学院

您的位置：首页>教程>正文

教程正文

ES6 页面重定向

ES6 页面重定向

  重定向是一种将用户和搜索引擎发送到不同URL的方法。页面重定向是一种自动将网页重定向到另一个网页的方法。重定向页面通常位于同一网站上,当然也可以位于不同的网站或服务器上。

JavaScript 页面重定向

  window.location和window.location.href

  在JavaScript中，你可以使用多种方法将网页重定向到另一个页面。几乎所有方法都与window.location对象相关，它是window对象的属性。它可以用来获取当前的URL地址(网址)，并将浏览器重定向到一个新的页面。这两种用法在行为上是一致的。window.location返回一个对象。如果href没有设置，window.location默认使用参数.href.

例子

<!DOCTYPE html> 
<html> 
   <head> 
      <script> 
         function newLocation() { 
            window.location = "http://www.xyz.com"; 
         } 
      </script> 
   </head> 

   <body> 
      <input type = "button" value = "Go to new location" onclick = "newLocation()"> 
   </body> 
</html>

location.replace()

  另一种最常用的方法是window.location对象的replace()方法，它将用一个新的替换当前文档。在replace()方法中，您可以通过新的URL替换()方法，它将执行http重定向。

  下面是语法。

window.location.replace("http://www.abc.com");

location.assign()

  location.assign()方法在浏览器窗口中加载新文档.

  下面是语法。

window.location.assign("http://www.abc.org");

assign() vs replace()

  assign()和replace()方法的区别在于location.replace()方法从document.history中删除当前URL，它无法导航回原始文档。在这种情况下，您不能使用浏览器“后退”按钮。如果要避免这种情况，应该使用location.assign ()方法，因为它在浏览器中加载一个新文档。

location.reload()

  location.reload()方法在浏览器窗口中重新加载当前文档。

  下面是语法。

window.location.reload("http://www.yahoo.com");

window.navigate()

  window.navigate()方法类似于为window.location.href属性。因为它只在internet explorer中可用，所以您应该避免在跨浏览器开发中使用它。

  下面是语法

window.navigate("http://www.abc.com");

重定向与搜索引擎优化

  如果您想通知搜索引擎(SEO)关于您的URL转发，您应该将rel="canonical"标记添加到您的网站head部分，因为搜索引擎不分析JavaScript来检查重定向。

  下面是语法

<link rel = "canonical" href = "http://abc.com/" />


捐赠

友情链接