ES6 解释页面重定向

ES6 解释页面重定向

页面重定向是一种将用户和Web浏览器重定向到用户未请求的另一个Web地址的方法。用户和Web浏览器被重定向的页面可以在同一个Web服务器上,也可以在不同的Web服务器上。它也可以是不同的网站。

页面重定向功能是在2015年引入的,当时引入了新的ES6版本的JavaScript。它使用了window.location对象,该对象包含一组可以用于重定向页面的方法。

JavaScript页面重定向: 下面列出了所有的方法:

replace()方法: 该方法用于将当前页面的URL替换为用户需要重定向到的页面的新URL。

注意: replace方法从浏览器的历史记录中删除了当前URL,我们无法使用浏览器的后退键导航回该URL。

语法:

window.location.replace("");
JavaScript

它以字符串的形式接受传递给它括号内的重定向页面的URL。

示例: 此示例演示了replace()方法的使用。

HTML

<h2 id="GFG">
      Welcome To GFG
</h2>
<h3>Redirection using 
      <strong><i>.replace()</i></strong> method.
</h3>
<button onclick="redirectME()">
      Redirect Me!
</button>
<script>
    function redirectME() {
      window.location.replace("https://practice.geeksforgeeks.org/");
    }
</script>
JavaScript

输出:

ES6 解释页面重定向

assign()方法: 该方法用于将重定向页面的新位置分配给浏览器。

注意: 与replace方法不同,它不会从浏览器的历史记录中删除当前URL,因此如果需要,我们可以返回到前一页。

语法:

window.location.assign("");
JavaScript

它还接受一个字符串参数来重定向到一个新页面。

示例: 这个示例演示了使用assign()方法的用法。

HTML

<h2 id="GFG">Welcome To GFG</h2>
<h3>Redirection using <strong><i>.assign()</i></strong> method.</h3>
<button onclick="redirectME()">Redirect Me!</button>
<script>
    function redirectME() {
        window.location.assign("https://practice.geeksforgeeks.org/");
    }
</script>
JavaScript

输出:

ES6 解释页面重定向

reload() 方法:

用于重新加载当前页面到网页浏览器中的方法。

语法:

window.location.reload("");
JavaScript

示例: 此示例展示了reload()方法的使用

HTML

<h2 id="GFG">Welcome To GFG</h2>
<h3>
      Reload tab Using <strong><i>.reload()</i></strong> method.
</h3>
 
<button onclick="redirectME()">Reload Me!</button>
<script>
    function redirectME() {
        window.location.reload("https://practice.geeksforgeeks.org/");
    }
</script>
JavaScript

输出:

ES6 解释页面重定向

navigate() 方法: 此方法用于将新值分配给 window.location 对象,但只有在Internet Explorer中有用,所以其他浏览器不支持它,可以避免使用。

语法:

window.navigate("");
JavaScript

注意: 在HTML文档的头部标签中使用 rel=’canonical’ 来通知搜索引擎您正在使用页面重定向。这将有助于提高网页在搜索引擎优化(SEO)中的排名。

Python教程

Java教程

Web教程

数据库教程

图形图像教程

大数据教程

开发工具教程

计算机教程

登录

注册