js页面实时显示时间

最新推荐文章于 2022-11-02 21:21:33 发布

weixin_34137799

最新推荐文章于 2022-11-02 21:21:33 发布

阅读量105

点赞数

CC 4.0 BY-SA版权

文章标签： javascript ViewUI

原文链接：https://segmentfault.com/a/1190000007231613

今天做了一个笔试，让实时显示当前时间，回来以后，自己动手敲代码，但是发现一个问题，通过getMonth()得到月份，总是会比当前月份少1，深深地觉得实践出真知啊……之前觉得Date对象挺简单的，有很多细节都没有注意。这次认认真真又重新看了相关内容，现把需要注意的地方总结如下：1、通过getDay()得到的星期数是从0开始，0表示星期天，之后从1~6依次表示星期一到星期六；
2、得到日期需使用getDate()而不是getDay(),因为可能习惯性地认为日期就是天数，可能会使用getDay()，但其实getDay()是用于得到星期数的；
3、通过getMonth()得到月份，从0开始计数，所以需要再加1。
代码如下：

<html>
<head>
    <title></title>
    <meta http-equiv="content-type" content="text/html;charset=utf-8">
    <link rel="stylesheet" type="text/css" href="">
    <script type="text/javascript"></script>
    <style type="text/css">
        input{
            width: 200px;
        }
    </style>
</head>
<body>
    <input id="input">
    <script type="text/javascript">
        var in_1 = document.getElementById('input');
        function showTime(){
            var date = new Date();
            var week = date.getDay();
            var weekday;
            switch(week){
                case 0: weekday = '星期天';break;
                case 1: weekday = '星期一';break;
                case 2: weekday = '星期二';break;
                case 3: weekday = '星期三';break;
                case 4: weekday = '星期四';break;
                case 5: weekday = '星期五';break;
                case 6: weekday = '星期六';break;
            }
            var year = date.getFullYear();
            var month = date.getMonth() + 1;
            var day = date.getDate();
            var hour = date.getHours();
            var minute = date.getMinutes();
            var second = date.getSeconds();
            var in_1 = document.getElementById('input');
            in_1.value = year + '年' + month + "月" + day + '日'+' ' + weekday + ' ' + hour + ':' + minute + ':' + second;
            setTimeout(showTime,1000);
        }
        showTime();
    </script>
</body>
</html>