JavaScript刷新页面的几种方法总结

location.reload与replace方法详解

1. 使用reload方法

该API用于强制浏览器重新加载当前页面。

调用语法为：location.reload([bForceGet])

参数bForceGet为可选布尔值，默认false表示从客户端缓存中获取当前页；若设为true，则以GET请求方式从服务端获取最新页面，效果等同于用户点击浏览器的F5刷新按钮。

2. 使用replace方法

该方法通过指定的URL替换当前历史记录中的条目。使用replace后，用户无法通过“前进”或“后退”按钮访问被替换前的URL。

调用语法为：location.replace(URL)

常规场景下，通常使用location.reload()或history.go(0)来实现刷新。

此方式类似于点击F5刷新，当页面采用method="post"提交时，会触发“网页过期”提示，这是由Session的安全保护机制所致。

调用location.reload()时，ASPX页面在服务器内存中已存在，因此必然处于IsPostback状态。

若应用场景需要重新加载页面，即期望页面在服务器端重新创建，且状态为Not IsPostback。

此时可使用location.replace()完成任务，被replace的页面每次都会在服务器端重新生成。

相关代码示例如下：

 location.replace(location.href);

返回上一页并刷新：

location.replace(document.referrer);

获取前一个页面的URL可通过document.referrer属性。

避免使用history.go(-1)或history.back()来返回并刷新页面，因为这两种方法仅返回上一页而不会触发刷新。

其他刷新页面及自动刷新代码

补充：JavaScript刷新页面的其他常用方法包括：

1. history.go(0)
2. location.reload()
3. location=location
4. location.assign(location)
5. document.execCommand('Refresh')
6. window.navigate(location)
7. location.replace(location)
8. document.URL=location.href

自动刷新页面的实现方法：

1. 页面自动刷新：将以下代码插入<head>区域中

<meta http-equiv="refresh" content="20">

其中数字20表示每隔20秒刷新一次页面。

2. 页面自动跳转：将以下代码插入<head>区域中

<meta http-equiv="refresh" content="20;url=http://www.baidu.com">

其中数字20表示隔20秒后跳转到http://www.baidu.com页面。

3. 页面自动刷新的JS版本：

<script type="text/javascript">
function myrefresh()
{
 window.location.reload();
}
setTimeout('myrefresh()',1000); //指定1秒刷新一次
</script>

4. JS刷新框架的脚本语句：

//刷新包含该框架的页面用 
<script type="text/javascript">
 parent.location.reload();
</script>
//子窗口刷新父窗口
<script type="text/javascript">
 self.opener.location.reload();
</script>
(　或　<a href="javascript:opener.location.reload()" rel="external nofollow" >刷新</a> )
//刷新另一个框架的页面用 
<script type="text/javascript">
 parent.另一FrameID.location.reload();
</script>

若需在关闭窗口时或开窗时刷新，可在<body>标签中调用以下语句。

<body onload="opener.location.reload()"> 开窗时刷新
<body onUnload="opener.location.reload()"> 关闭时刷新
<script>
 window.opener.document.location.reload()
</script>
 

以上介绍了JavaScript刷新页面的几种方法详解整合，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对本站网站的支持！