本文介绍一种纯前端JavaScript方案,通过修改URL地址栏参数来标记页面状态,实现页面加载时仅自动刷新一次的效果。该方法无需后台程序支持,利用location.href获取当前地址并拼接参数,结合self.location.replace完成刷新操作,适用于需要强制重载但避免无限循环的场景。
JavaScript 实现页面仅刷新一次的代码示例
具体实现代码如下所示:
<Script>
function reurl(){
url = location.href; //将当前页面的完整地址赋值给变量 url
var times = url.split("?"); //以问号 "?" 为分隔符,将变量 url 分割成数组
if(times[1] != 1){ //判断问号后的参数值是否不等于1,若不等则说明尚未执行过刷新操作
url += "?1"; //在变量 url 的末尾追加字符串 "?1"
self.location.replace(url); //使用 replace 方法刷新页面,避免产生历史记录
}
}
onload=reurl
</script> 2.原理
基于 URL 参数的实现原理
该方案的核心在于充分利用浏览器地址栏支持携带参数的特性,通过脚本解析页面间传递的参数来实现状态控制,整个过程完全在前端完成,无需任何后台程序的支持。