
itclancoder
V1
2022/09/08阅读:37主题:绿意
JS如何实现自动刷新页面
前言
在一些具有实效特点的网站,可视化数据实时大屏,比如:股票价格,外汇牌价,全国疫情实时数据统计等 定时地自动刷新网页,把最新的数据展示给用户,这样的效果在javaScript
中如何实现呢 在JavaScript
里有一个reload
函数可以实现这样的效果
具体实现
// 自动刷新函数
function autoRefresh() {
window.location.reload(); // 调用location的reload函数
}
setTimeout(() => {
autoRefresh();
},3000) // 3秒钟,自动刷新一次
难点剖析
实现这个效果,需要知道reload()函数的作用是让浏览器刷新当前网页,其次网页的自动刷新离不开一个定时器,也就是setTimeout()函数,这个函数 属于window对象,它也是顶层对象,所以直接写函数名称就能被调用,不需要写完整的window.setTimeout(),接收两个参数,第一个是回调函数,具体要执行的代码,第二个是间隔的时间,单位为毫秒,上面示例中是3秒执行一次
额外拓展
有一种最简单的方式就是直接用一行代码就可以实现,使用meta标签即可实现,还可以实现自动跳转到某个指定的网站上
<meta http-equiv="refresh" content="5;url=https://tv.itclan.cn/">
作者介绍

itclancoder
V1
微公号:itclanCoder