zoukankan      html  css  js  c++  java
  • JavaScript实现页面实时显示时间

    JavaScript实现页面实时显示时间

    使用 setInterval() 函数

    setInterval() 方法可按照指定的周期(以毫秒计)来调用函数或计算表达式

    setInterval("getTime()",1000); 以1000毫秒间隔调用函数有一个问题就是刚打开页面时的1s会不显示

    为此我们可以在之前先调用一遍函数 getTime();

    这样无论何时都能实时显示时间啦

    .html代码如下

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <title>JS时间</title>
          
    </head>
    <body>
    
        <script src="aa.js"></script>
        
        <div id="getTime" style="float: left;
                                 margin-left: 10px;
                                 margin-top: 15px;
                                 background-color: #aabbcc;">
            <p>
            <script>
                getTime();
                setInterval("getTime()",1000);
            </script>
            </p>
        
        </div>
    
    </body>
    </html>

    .js代码如下

    function getTime(){
        var Week, Weekday;
        var date =  new Date();
        
        Week = ["星期天", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"];
        Weekday = date.getDay();
        
        year = date.getFullYear();
        month = date.getMonth() + 1;
        day = date.getDate();
        hours = date.getHours();
        minutes = date.getMinutes();
        seconds = date.getSeconds();
        
        document.getElementById("getTime").innerHTML = year + "年" + month + "月" + day + "日" + "	" + hours + ":" + minutes + ":" + seconds + "	" + Week[Weekday];
    
    };

    效果如下

  • 相关阅读:
    大端小端
    浅谈协程
    boost总结之any
    boost总结之variant
    STL总结之functor
    zabbix设置多个收件人
    zabbix设置发送消息的时间
    zabbix利用微信报警
    Windos无法验证文件数组签名
    zabbix基础安装
  • 原文地址:https://www.cnblogs.com/s1eepDumling/p/11558730.html
Copyright © 2011-2022 走看看