JavaScript实现页面刷新与重新加载的完整指南

一、刷新或重新加载当前页面

1、使用 reload 方法

语法格式为：location.reload([forceGet])

参数说明：forceGet 为可选参数，默认值为 false，表示从客户端缓存中获取当前页面；若设置为 true，则以 GET 方式从服务端获取最新页面，效果等同于客户端点击 F5 键进行刷新。

2、使用 replace 方法

语法格式为：location.replace(URL)

方法说明：该方法通过指定的 URL 替换当前存储在客户端历史记录中的项目。因此，使用 replace 方法后，用户无法通过“前进”或“后退”按钮访问被替换的 URL。通常推荐使用 location.reload() 或 history.go(0) 来刷新当前页面，这种方式类似于点击 F5 刷新。需要注意的是，当 HTTP 请求方法为 POST 时，受限于 Session 的安全保护机制，可能会出现“网页已过期”的提示。

示例代码如下：location.replace(location.href); 其中location.href为当前页面url。

二、返回并刷新前一个页面

window.open(document.referrer,"_parent",''); // 经测试，此代码可实现返回前一个页面并刷新

或者使用以下代码：

location.replace(document.referrer);

注：document.referrer 为前一个页面的URL。

若需返回前一个页面但不进行刷新，可使用：

history.go(-1); 或 history.back();

二、定时刷新（或跳转）页面

1、实现当前页面的定时刷新

示例：每隔 3 秒刷新一次页面：

<meta http-equiv=“refresh” content=“3”>

2、实现定时跳转

<meta http-equiv=“refresh” content=“2;url=‘https://www.baidu.com'”>

注意：在 < 和 meta 标签之间不能包含空格。

3、其他实现方法

（1）延迟执行一次

setTimeout(code, milliseconds) 注意：使用 clearTimeout() 可以停止 setTimeout() 的执行。

（2）定时重复执行

setInterval(code, milliseconds); 注意：使用 clearInterval() 可以停止 setInterval 的执行。

三、刷新包含框架的页面

1、刷新包含该框架的父页面

<script language=JavaScript>
    parent.location.reload();
</script> 

2、子窗口刷新父窗口

<script language=JavaScript>
    self.opener.location.reload();
</script> 

3、刷新另一个框架的页面

window.parent.frames[1].location.reload();
window.parent.frames.bottom.location.reload();
window.parent.frames[“bottom”].location.reload();
window.parent.frames.item(1).location.reload();
window.parent.frames.item(‘bottom').location.reload();
window.parent.bottom.location.reload();
window.parent[‘bottom'].location.reload();

总结

至此，关于 JavaScript 页面刷新与重新加载功能的实现介绍完毕。如需了解更多相关 JS 页面刷新与重新加载内容，请搜索本站历史文章或继续浏览下方相关文章。感谢大家的支持！