JS 实时显示当前时间

最新推荐文章于 2024-09-14 14:12:48 发布

web_Baron

最新推荐文章于 2024-09-14 14:12:48 发布

阅读量210

点赞数 1

分类专栏： web前端文章标签： jquery

本文链接：https://blog.csdn.net/web_Baron/article/details/115699781

版权

web前端专栏收录该内容

11 篇文章 0 订阅

订阅专栏

本文介绍了如何使用JavaScript实现网页上实时显示当前时间的功能，通过代码示例展示了一段可以直接粘贴复制的解决方案。

摘要由CSDN通过智能技术生成

效果：
在这里插入图片描述
代码：

可直接粘切复制处：

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>显示当前文件</title>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js"></script>

</head>

<body>
    <div id="start"></div>
    <script>
        $(function() {
                var t = null;
                t = setTimeout(time, 1000); //开始运行
                function time() {
                    clearTimeout(t); //清除定时器
                    var dt = new Date();
                    var year = dt.getFullYear();
                    var month = dt.getMonth() + 1; //(0-11 0代表一月)
                    var date = dt.getDate(); //获得天
                    var num = dt.getDay(); //获得星期
                    var weekday = ["星期天", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"];
                    var hour = dt.getHours(); //获得时
                    var minute = dt.getMinutes() //获得分
                    var second = dt.getSeconds() //获得秒
                    document.getElementById("start").innerHTML = year + "年" + month + "月" + date + "日" + "\t" + hour + ":" + minute + ":" + second + "" + "\t" + weekday[num];
                    t = setTimeout(time, 1000); //设置定时器 ， 循环运行
                }
            })
            // 补位函数？
        function extra(x) {
            // 如果传入数字小于10 ， 数字前补以为0 
            if (x < 10) {
                return "0" + x;
            } else {
                return x;
            }
        }
    </script>
</body>

</html>