Js如何实现页面自动刷新

在一些具有实效特点的网站,可视化数据实时大屏,比如:股票价格,外汇牌价,全国疫情实时数据统计等 定时地自动刷新网页,把最新的数据展示给用户,这样的效果在javaScript中如何实现呢 在JavaScript里有一个reload函数可以实现这样的效果

示例效果

具体js代码

// 自动刷新函数
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/"> 

© 版权声明
THE END
喜欢就支持一下吧
点赞8赞赏 分享