【js效果】动态获取系统时间

方法一

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>js实现数字时钟</title>
</head>
<body>
    <div id="clock"></div>

    <script type="text/javascript">
        function clock(){
                var date = new Date();
                var year = date.getFullYear();    //年
                var month = date.getMonth() + 1;  //月
                var day = date.getDate();         //日

                var week = date.getDay(); //以数值获取周名（0-6）
                var weeks = ["星期日","星期一","星期二","星期三","星期四","星期五","星期六"];

                // 补位
                function buwei(value){
                    if(value < 10){
                         value = "0" + value;
                    }
                    return value;
                }

                var h = buwei(date.getHours());
                var m = buwei(date.getMinutes());
                var s = buwei(date.getSeconds());

                var time = year + "年" + month + "月" + day + "日" + "\xa0" + weeks[week] + "\xa0\xa0\xa0" + h + ":" + m + ":" + s;

                document.getElementById("clock").innerText = time;
            }
            setInterval(clock,1000)
    </script>
</body>
</html>

方法二

function clock(){
    var date = new Date();
    var year = date.getFullYear();
    var month = date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1): date.getMonth() + 1;
    var day = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
    var week = date.getDay(); //以数值获取周名（0-6）
    var weeks = ["星期日","星期一","星期二","星期三","星期四","星期五","星期六"];

    var h = date.getHours();
    var m = date.getMinutes();
    var s = date.getSeconds();

    var time = year + "-" + month + "-" + day + "\xa0\xa0\xa0" + weeks[week] + "\xa0\xa0\xa0" + h + ":" + m + ":" + s;
    document.getElementById("clock").innerText = time;
}
setInterval(clock,1000);

【js效果】动态获取系统时间

方法一

方法二

猜你喜欢