JS页面刷新的方法总结

最新推荐文章于 2023-12-06 21:10:57 发布
最新推荐文章于 2023-12-06 21:10:57 发布
阅读量564 收藏
点赞数
分类专栏： web前端

window.location.reload()，window.history.go(0)和document.execCommand(''Refresh'')，这三个方法是最快速的。其他的都有明显的浏览器滚动条的出现。
Javascript刷新页面的几种方法： 
1 history.go(0)
除非有<%..%>等需在服务端解释才能生成的页面代码,否则直接读取缓存中的数据
不刷新
2 location.reload()
要重新连服务器以读得新的页面(虽然页面是一样的) 
刷新
3 location=location

要在javascript中导航，不是调用window对象的某个方法，而是设置它的location.href属性，location属性是每个浏览器都支持的。比如：

1

<span onclick=”javascript:window.location.href=’#top’”>top</span>

执行后有后退、前进
4 location.assign(location)
加载 URL 指定的新的 HTML 文档。 就相当于一个链接，跳转到指定的url，当前页面会转为新页面内容，可以点击后退返回上一个页面。 
5 document.execCommand('Refresh') 
6 window.navigate(location)
MSDN说的window.navigate(sURL)方法是针对IE的，不适用于FF，在HTML DOM Window Object中，根本没有列出window.navigate方法。
7 location.replace(location)
执行后无后退、前进
通过加载 URL 指定的文档来替换当前文档 ，这个方法是替换当前窗口页面，前后两个页面共用一个
窗口，所以是没有后退返回上一页的
8 document.URL=location.href

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

自动刷新页面的方法: javascript自动刷新页面方法详解
1.页面自动刷新：把如下代码加入<head>区域中

1
<meta http-equiv="refresh" content="20">
其中20指每隔20秒刷新一次页面.

2.页面自动跳转：把如下代码加入<head>区域中

1
<meta http-equiv="refresh" content="20;url=http://www.php.cn">

其中20指隔20秒后跳转到http://www.php.cn页面

3.页面自动刷新js版

1
2
3
4
5
<script language="JavaScript">function myrefresh()
{
window.location.reload();
}
setTimeout('myrefresh()',1000); //指定1秒刷新一次</script>

JS刷新框架的脚本语句

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
//如何刷新包含该框架的页面用
<script language=JavaScript>
parent.location.reload();
</script>
 
//子窗口刷新父窗口
<script language=JavaScript>
self.opener.location.reload();
</script> www.jbxue.com
(　或　<a href="javascript:opener.location.reload()">刷新</a> )
 
//如何刷新另一个框架的页面用
<script language=JavaScript>
parent.另一FrameID.location.reload();
</script>

如果想关闭窗口时刷新或者想开窗时刷新的话，在<body>中调用以下语句即可。

1
2
3
4
5
6
<body onload="opener.location.reload()"> 开窗时刷新
<body onUnload="opener.location.reload()"> 关闭时刷新
 
<script language="javascript">
window.opener.document.location.reload()
</script>

总结：

本文通过实例讲述了JavaScript中刷新页面的方法，其中主要讲解了比较常用的几种方法，小伙伴们可以根据自己的需求选择适合自己的方法！

leoliyou
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
JavaScript刷新页面的几种方法总结
12-09
1，reload 方法 该方法强迫浏览器刷新当前页面。 语法：location.reload([bForceGet]) 参数： bForceGet， 可选参数， 默认为 false，从客户端缓存里取当前页。true, 则以 GET 方式，从服务端取最新的页面, 相当于客户端点击 F5(“刷新”) 2，replace 方法 方法通过指定URL替换当前缓存在历史里（客户端）的项目，因此当使用replace方法之后，你不能通过“前进”和“后退”来访问已经被替换的URL。 语法： location.replace(URL) 通常使用： location.reload() 或者是 history.go(
JS刷新当前页面的几种方法总结
10-26
本篇文章主要是对JS刷新当前页面的几种方法进行了详细的总结介绍，需要的朋友可以过来参考下，希望对大家有所帮助
js实现刷新当前页面
weixin_45326220的博客
11-13 1289
本文为大家介绍三种 js 刷新当前页面的方法
console定时刷新页面，且不会因刷新页面导致js失效
蒋蒋
01-10 8917
timeout=prompt("Set timeout (Second):"); count=0 current=location.href; if(timeout>0) setTimeout('reload()',1000*timeout); else location.replace(current); function reload(){ setTimeout('reload()',1...
js刷新页面方法大全
zy408710468的专栏
05-07 1964
1，reload 方法，该方法强迫浏览器刷新当前页面。 语法：location.reload([bForceGet])    参数： bForceGet， 可选参数， 默认为 false，从客户端缓存里取当前页。true, 则以 GET 方式，从服务端取最新的页面, 相当于客户端点击 F5("刷新") 2，replace 方法，该方法通过指定URL替换当前缓存在历史里（客户端）的项目，因
js刷新页面方法合集分享
xiaoweids的博客
07-16 6061
用js刷新当前页面的几种方法，包括reload方法、replace方法、自动刷新方法等。有需要的朋友参考下吧
js刷新页面的几种方式与区别
qq_41353397的博客
03-28 946
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 window.location.reload()，window
js实现实时刷新(setInterval、WebSocket、EventSource)
最新发布
muzidigbig的博客
12-06 1246
可能有很多的同学有用 setInterval 控制 ajax 不断向服务端请求最新数据的经历看下面的代码：当结果返回之后再延时触发下一次的请求，这样虽然没办法保证两次请求之间的间隔时间完全一致但是至少可以保证数据返回的节奏是稳定的，看似已经实现了需求但是这么搞我们先不去管他的性能就代码结构也算不上优雅，为了解决这个问题可以让服务端长时间和客户端保持连接进行数据互通h5新增了和 EventSource 用来实现长轮询，下面我们来分析一下这两者的特点以及使用场景。
JavaScript页面刷新的方法
想好了再写！
03-24 273
1，reload方法 该方法强迫浏览器刷新当前页面。 语法：location.reload() 2，replace方法 当使用replace方法之后，不能通过“前进”和“后退”来访问已经被替换的URL。 语法： location.replace(URL) 返回并刷新页面： location.replace(document.referrer); document.referrer //前一个页面的URL 不要用 history.go(-1)，或 history.back();来返回并刷新页面，这两种方法
Javascript刷新页面的几种方法
s_156的博客
05-27 462
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 window.location.reload()，window
JS关于刷新页面的相关总结
10-18
在本篇内容中我们给大家整理了关于JS刷新页面的所有相关知识点以及整理了相关的技术文章，大家可以收藏本页面继续深入学习。
前端vue/js刷新浏览器页面方法-案例
JackieDYH的博客
04-15 2580
强制刷新当前页面 reload　--强迫浏览器刷新当前页面 location.reload([bForceGet]) //重新加载当前文档 bForceGet， 可选参数， 默认为 false，从客户端缓存里取当前页。true, 则以 GET 方式，从服务端取最新的页面, 相当于客户端点击 F5("刷新") replace -- 通过指定URL替换当前缓存在历史里（客户端）的项目，因此当使用replace方法之后，你不能通过“前进”和“后退”来访问已经被替换的URL locati..
通过版本号控制强制刷新浏览器或清空浏览器缓存
AI全栈 和 IT 编程相关分享
08-14 2800
在我们做 web 项目时，经常会遇到一个问题就是，需要的情况。而对于用户而言，很多人一方面不懂如何操作，另一方面由于执行力问题，很少有人进行这样的操作。进而遇到常见的缓存问题而上报运维问题。耽误用户的同时，也增加了我们的运维工作量。甚至有时研发人员还经常吐槽（都告诉他刷新了，怎么就不刷！今天，咱们通过简单的几行代码，来实现灵活控制，是否强制提醒并提供便利的操作让业务人员自动执行此操作！
【实用小脚本】JS自动刷新页面
遇见的博客
03-20 6046
1、限时活动、秒杀活动中，自动循环刷新2、学习通刷访问次数，刷学习次数3、网站刷访问量、刷访问次数4、等等。。。很多的，小伙伴们自己去发现吧。
在javascript中重新加载/刷新页面的不同方法
南北极之间
07-05 4923
我们将看到一些可以与HTML和/或javascript一起使用的方法。我们可以使用浏览器历史记录方法刷新当前页面。 设置元标记 我们还可以设置元标记http-equiv，它将以给定的时间间隔自动刷新页面。 这将在指定的秒数后重新加载页面。此处等于 1 秒。我们还可以使用方法重新加载或刷新当前页面。 方法采用一个参数来确定应如何重新加载页面。正在不推荐使用传递 true/false 参数，您可以只调用该方法，而无需任何参数进行重新加载，否则使用其他方法。方法返回/加载当前 url。因此，我们可
js刷新当前页面的5种方式
热门推荐
狼魂之力
08-27 2万+
1。 reload reload 方法，该方法强迫浏览器刷新当前页面。 语法：location.reload([bForceGet]) 参数： bForceGet， 可选参数， 默认为 false，从客户端缓存里取当前页。true, 则以 GET 方式，从服务端取最新的页面, 相当于客户端点击 F5(“刷新”) reload() 方法用于重新加载当前文档。 如果该方法没有规定参数，或者参数是 false，它就会用 HTTP 头 If-Modified-Since 来检测服务器上的文档是否已改变。如果文档已改
利用js刷新页面方法
weixin_30432579的博客
12-25 405
1，reload 方法，该方法强迫浏览器刷新当前页面。 location.reload(force) 如果该方法没有规定参数，或者参数是 false，它就会用 HTTP 头 If-Modified-Since 来检测服务器上的文档是否已改变。如果文档已改变，reload() 会再次下载该文档。如果文档未改变，则该方法将从缓存中装载文档。这与用户单击浏览器的刷新按钮的效果是完全一样的。 ...
elementui ajax 提交成功后刷新页面
09-19
### 回答1： 如果您使用 elementui 的 ajax 方法提交表单并希望在提交成功后刷新页面，可以在 ajax 方法的 `success` 回调函数中使用 `location.reload()` 方法来刷新页面。 例如： ``` this.$ajax({ url: '/api/submit-form', method: 'post', data: formData, success: function (response) { // 在这里执行刷新页面的操作 location.reload(); } }); ``` 注意，在刷新页面之前，您可能需要先执行一些其他操作，例如关闭弹出窗口或提示用户提交成功。 ### 回答2： 如果使用ElementUI进行ajax提交成功后刷新页面，可以通过以下步骤实现： - 在ajax请求的success回调函数中，调用window.location.reload方法刷新页面。 - 首先，在页面上引入ElementUI的相关资源文件，确保ElementUI的样式和功能能够正常加载和渲染。 - 然后，添加一个事件监听器，当提交按钮被点击时，执行ajax请求。 - 在ajax请求的success回调函数中，调用window.location.reload方法刷新页面。这会重新加载当前页面，并执行一次完整的页面生命周期，包括重新加载所需的资源文件、重新执行页面的初始化操作等。 - 最后，根据具体的业务需求，可能还需要在页面刷新前保存一些已修改的数据，以便刷新后能够正确显示。 需要注意的是，这种方法会重新加载整个页面，可能会导致用户当前的操作和状态丢失。如果希望只更新某个部分的内容而不刷新整个页面，可以考虑使用Vue.js等前端框架来实现局部刷新的功能。 ### 回答3： 使用Element UI中的Ajax方法提交成功后刷新页面，可以通过以下步骤实现： 1. 在HTML页面中引入Element UI的相关文件，确保能够使用Element UI的组件和方法。 2. 在JavaScript代码中使用Ajax方法向服务器提交数据。可以通过axios或者Element UI提供的$this.$http.post进行Ajax请求。 例如使用axios，可以使用如下代码： ```javascript axios.post('提交地址', 参数) .then(function (response) { console.log(response); // 提交成功后执行刷新页面的逻辑 window.location.reload(); }) .catch(function (error) { console.log(error); }); ``` 3. 在Ajax请求的then方法中，当提交成功后执行刷新页面的逻辑。可以使用`window.location.reload`方法重新加载当前页面来实现页面刷新。 总结： 使用Element UI的Ajax方法提交成功后刷新页面，可以通过使用axios或者$this.$http.post等方法发送Ajax请求，然后在请求成功的回调函数中执行`window.location.reload`来实现页面刷新。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值