js 实现页面刷新
使用 location.reload() 方法
通过调用 location.reload() 可以强制刷新当前页面。该方法接受一个布尔参数,用于控制是否绕过缓存刷新:
// 强制从服务器重新加载(绕过缓存)
location.reload(true);
// 默认方式(可能使用缓存)
location.reload();
使用 location.href 重定向
将当前页面的 URL 重新赋值给 location.href 或直接使用 location 对象实现刷新:
// 方法1
location.href = location.href;
// 方法2
location = location;
使用 history.go(0)
通过浏览器的历史记录 API 实现刷新,参数 0 表示重新加载当前页面:
history.go(0);
使用 meta 标签自动刷新
在 HTML 的 <head> 中添加 meta 标签,设置自动刷新时间(单位为秒):
<meta http-equiv="refresh" content="2">
使用 setTimeout 延迟刷新
通过 setTimeout 实现延迟刷新,适用于需要等待某些操作完成后刷新的场景:
setTimeout(() => {
location.reload();
}, 2000); // 2秒后刷新
监听事件触发刷新
结合事件监听实现条件触发刷新,例如点击按钮或收到特定数据后刷新:
document.getElementById('refreshBtn').addEventListener('click', () => {
location.reload();
});
注意事项
- 强制刷新(
reload(true))可能导致服务器负载增加,慎用。 - 部分方法可能因浏览器安全策略受限(如跨域场景)。
- 单页应用(SPA)中频繁刷新可能影响用户体验,建议优先使用状态管理。







