JavaScript刷新页面的多种技巧:reload、replace与自动刷新
本文档详细介绍了JavaScript中刷新当前页面的几种方法,这对于前端开发者来说是一项实用技能。首先,我们有"reload"方法,这是最基础的刷新方式。它使用`location.reload()`函数,允许开发者选择是否强制从服务器获取最新版本,通过设置`bForceGet`参数为`true`,实现类似于用户点击F5键的刷新效果。默认情况下,这个方法会从客户端缓存中获取页面。 其次,"replace"方法是另一种刷新策略,通过`location.replace(URL)`,它会替换浏览器的历史记录,使得用户无法通过"前进"或"后退"回到之前的页面。这个方法适合那些需要页面从服务器完全重新加载的情况,比如ASP.NET页面中的post请求,因为服务端的session状态可能会受到影响。 文章特别提到了避免使用`history.go(-1)`或`history.back()`,因为它们不会触发页面的刷新,只会改变浏览历史。另外,还介绍了一些其他的方法,如`history.go(0)`、`location=location`、`location.assign(location)`、`document.execCommand('Refresh')`、`window.navigate(location)`以及`location.replace(location)`,这些都是在不同的场景下实现页面刷新的不同手段。 值得注意的是,每种方法都有其适用性和局限性,开发者需要根据具体需求来选择合适的刷新方式。例如,如果只是为了简单地更新页面内容而不想改变浏览历史,那么`reload`方法可能就足够了;而如果需要清除页面上的所有数据和状态,或者确保从服务器重新加载,`replace`方法则是更好的选择。 掌握这些JavaScript刷新页面的方法,可以帮助开发人员构建更加动态和灵活的网页应用,提升用户体验。
如何实现刷新当前页面呢?借助js你将无所不能。
1,reload 方法,该方法强迫浏览器刷新当前页面。
语法: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);
document.referrer //前一个页面的URL
不要用 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)
自动刷新页面的方法:
1,页面自动刷新:把如下代码加入<head>区域中
复制代码 代码如下:
<meta http-equiv="refresh" content="20">
其中20指每隔20秒刷新一次页面.
2,页面自动跳转:把如下代码加入<head>区域中
复制代码 代码如下:
<meta http-equiv="refresh" content="20;url=http://www.jb51.net">
其中20指隔20秒后跳转到http://www.jb51.net页面
3,页面自动刷新js版
复制代码 代码如下:
<script language="JavaScript">
function myrefresh()
{
window.location.reload();
}
setTimeout('myrefresh()',1000); //指定1秒刷新一次
</script>
4,JS刷新框架的脚本语句
复制代码 代码如下:
//刷新包含该框架的页面用
<script language=JavaScript>
parent.location.reload();
</script>
//子窗口刷新父窗口
剩余6页未读,继续阅读
- 粉丝: 52
- 资源: 129
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
最新资源
- 李兴华Java基础教程:从入门到精通
- U盘与硬盘启动安装教程:从菜鸟到专家
- C++面试宝典:动态内存管理与继承解析
- C++ STL源码深度解析:专家级剖析与关键技术
- C/C++调用DOS命令实战指南
- 神经网络补偿的多传感器航迹融合技术
- GIS中的大地坐标系与椭球体解析
- 海思Hi3515 H.264编解码处理器用户手册
- Oracle基础练习题与解答
- 谷歌地球3D建筑筛选新流程详解
- CFO与CIO携手:数据管理与企业增值的战略
- Eclipse IDE基础教程:从入门到精通
- Shell脚本专家宝典:全面学习与资源指南
- Tomcat安装指南:附带JDK配置步骤
- NA3003A电子水准仪数据格式解析与转换研究
- 自动化专业英语词汇精华:必备术语集锦