定时刷新html页面demo

Hadoop_Liang

已于 2022-09-24 09:50:56 修改

阅读量1.5k

点赞数

分类专栏：小技巧前端文章标签： html javascript

于 2022-09-23 23:14:30 首次发布

本文链接：https://blog.csdn.net/qq_42881421/article/details/127019393

版权

小技巧同时被 2 个专栏收录

10 篇文章

订阅专栏

前端

8 篇文章

订阅专栏

定时刷新html页面，核心语句：

    <!-- 每3秒钟刷新一次页面 -->
    <meta http-equiv="refresh" content="3">

如果需要3秒后自动跳转到指定的url页面，语句如下：

    <!-- 3秒后自动跳转到url所指的页面 -->
    <meta http-equiv="refresh" content="3;url=http://www.baidu.com" >

每3秒定时刷新页面，为了明显的看到刷新效果，添加了日期显示，完整代码：demo.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!-- 每3秒钟刷新一次页面 -->
    <meta http-equiv="refresh" content="3">
    <title>Document</title>
</head>
<body>
    <h2>Hello</h2>
    <p id="time"></p>

    <script>
        var weekArr = new Array("星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六");
        // 立即执行函数
        (function gettime(){
            var date = new Date();
            var strDate = date.getFullYear()+"年"
                            +(date.getMonth()+1)+"月"
                            +date.getDate()+"日 "
                            +weekArr[date.getDay()]+" "
                            +date.getHours()+':'+date.getMinutes()+':'+date.getSeconds();
            document.getElementById("time").innerHTML = strDate;
        })()
    </script> 
</body>
</body>
</html>

浏览器访问demo.html