JavaScript location.replace() 方法：加载一个新文档（页面）替换当前文档

2024年4月30日 113次阅读 来源: zheng963

JavaScript location.replace() 方法

Location 对象的 replace() 方法用于重新加载当前文档（页面），语法如下：

location.replace( new_URL )

location.replace() 实例

该例子通过 location.replace() 方法加载一个新的页面来替换当前页面。

<html>

<script type="text/javascript">

function setReplace(){
    window.location.replace( "http://www.baidu.com" );
}

</script>

<body>
<button οnclick="setReplace()">加载新页面</button>
</body>
</html>

运行该例子，点击 加载新页面 的按钮，触发 setReplace() 函数，浏览器将加载百度首页以替换当前页面。

location.replace() 与 location.reload() 的区别

location.reload() 方法用于刷新当前页面，如果有 POST 数据提交，则会重新提交数据；location.reload() 则将新的页面以替换当前页面，它是从服务器端重新获取新的页面，不会读取客户端缓存且新的 URL 将覆盖 History 对象中的当前纪录（不可通过后退按钮返回原先的页面）。

如果想要刷新当前的页面，又避免 POST 数据提交，可以使用：

window.location.replace( location.href );

本章节内容共分 12 部分：

  1. 1. JavaScript Location 对象：获取或设置当前的 URL 信息
  2. 2. JavaScript location.hash 属性：设置或取得当前 URL 中的锚
  3. 3. JavaScript location.host 属性：设置或取得当前 URL 的主机名称和端口号
  4. 4. JavaScript location.hostname 属性：设置或取得当前 URL 的主机名
  5. 5. JavaScript location.href 属性：设置或取得当前完整的 URL（页面跳转）
  6. 6. JavaScript location.pathname 属性：设置或取得当前 URL 的路径部分
  7. 7. JavaScript location.port 属性：设置或取得当前 URL 的端口
  8. 8. JavaScript location.protocol 属性：设置或取得当前 URL 的协议
  9. 9. JavaScript location.search 属性：设置或取得当前 URL 的查询字串
  10. 10. JavaScript location.assign() 方法：加载一个新的文档
  11. 11. JavaScript location.reload() 方法：重新加载当前文档（刷新页面）
  12. 12. JavaScript location.replace() 方法：加载一个新文档（页面）替换当前文档
    原文作者：zheng963
    原文地址: https://blog.csdn.net/zheng963/article/details/50069137
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。
点赞