使用jQuery实现日期时间的获取

1、首先写一个div用于显示获取到的日期和时间

  <div class="show"></div>

2、为了方便查看,给显示日期的div写个样式

<style>
        * {
            margin: 0;
            padding: 0;
        }

        .show {
            width: 200px;
            height: 45px;
            line-height: 45px;
            text-align: center;
            border: 1px solid #000;
        }
    </style>

3、通过jQuery的方法获取到当前的时间并格式化,动态每秒更新变化显示

 $(document).ready(function () {
            function updateDate() {
                var currentDate = new Date();
                var date = currentDate.getDate(); // 获取当前日
                var month = currentDate.getMonth() + 1; // 获取当前月份(0——11)
                var year = currentDate.getFullYear(); // 获取当前年份
                var hours = currentDate.getHours(); // 获取当前时
                var minutes = currentDate.getMinutes(); // 获取当前分
                var seconds = currentDate.getSeconds(); // 获取当前秒

                // 格式化月份、日期、秒,保持两位数
                month = (month < 10 ? "0" : "") + month;
                date = (date < 10 ? "0" : "") + date;
                seconds = (seconds < 10 ? "0" : "") + seconds;

                // 将格式化后的日期显示在页面上的指定元素中
                $(".show").text(year + "-" + month + "-" + date + "  " + hours + ":" + minutes + ":" + seconds);
            };

            // 每秒更新一次日期
            setInterval(updateDate, 1000);
        })

  

posted @ 2024-07-19 09:57  Wanker  阅读(211)  评论(0)    收藏  举报