jQuery实现动态时间

最新推荐文章于 2022-02-18 10:46:03 发布

weixin_30897079

最新推荐文章于 2022-02-18 10:46:03 发布

阅读量300

点赞数

CC 4.0 BY-SA版权

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/fantianlong/p/10100230.html

<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="UTF-8">
    <title>jQuery实现动态时间</title>
    <script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
    <script>
        function datetime() {
            //创建日期时间对象
            var datetime = new Date();

            //获取组件
            var year = datetime.getFullYear();
            var month = datetime.getMonth() + 1;
            var day = datetime.getDate();
            var hour = datetime.getHours();
            var minute = datetime.getMinutes();
            var second = datetime.getSeconds();
            var week = datetime.getDay();

            //转换星期格式
            switch (week) {
                case 0:
                    var week = '星期日';
                    break;
                case 1:
                    var week = '星期一';
                    break;
                case 2:
                    var week = '星期二';
                    break;
                case 3:
                    var week = '星期三';
                    break;
                case 4:
                    var week = '星期四';
                    break;
                case 5:
                    var week = '星期五';
                    break;
                case 6:
                    var week = '星期六';
                    break;
            }

            //小时,分钟,秒如果小于10加上前导零
            if (hour < 10) {
                var hour = 0 + "" + hour;
            }

            if (minute < 10) {
                var minute = 0 + "" + minute;
            }

            if (second < 10) {
                var second = 0 + "" + second;
            }

            //完整时间
            var now =  year + "年" + month + "月" + day + "日" + " " + hour + ":" + minute + ":" + second + " " + week;

            //更新内容
            $("p").text(now);//这里是往p标签中添加
        }
    </script>
</head>
<body>
<p></p>

<script>
    //定时器
    setInterval(datetime, 1000);
</script>
</body>
</html>