用JavaScript格式化时间

最新推荐文章于 2024-08-08 02:21:16 发布

bigzhad

最新推荐文章于 2024-08-08 02:21:16 发布

阅读量121

点赞数

文章标签： html css 前端 javascript

本文链接：https://blog.csdn.net/hpz233/article/details/127640023

版权

<!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>Document</title>
    <style>
        body {
            background-color: #000;
            color: gold;
            text-align: center;
            font-size: 34px;
            font-weight: bold;
        }
    </style>
    <script>
        window.onload = function () { // 先读取完整个页面再加载js
            function fn() {
                var data = new Date()
                var year = data.getFullYear();
                var month = data.getMonth() + 1;
                var day = data.getDate();
                var hour = data.getHours();
                var min = data.getMinutes();
                var s = data.getSeconds();
                if (hour > 22) {
                    hour = '夜间' + hour;
                } else if (hour > 20) {
                    hour = '晚上' + hour;
                } else if (hour > 18) {
                    hour = '傍晚' + hour;
                } else if (hour > 17) {
                    hour = '黄昏' + hour;
                } else if (hour > 14) {
                    hour = '下午' + hour;
                } else if (hour > 11) {
                    hour = '中午' + hour;
                } else if (hour > 7) {
                    hour = '上午' + hour;
                } else if (hour > 5) {
                    hour = '清晨' + hour;
                } else {
                    hour = '深夜' + hour;
                }
                var aaa = `${year}年 ${month}月 ${day}天 ${hour}时 ${min}分 ${s}秒`;
                document.getElementsByTagName('h1')[0].innerHTML = aaa;
            }
            setInterval(fn, 1000)
        }

    </script>
</head>

<body>
    <!-- 1. 格式化时间
    //. 1 ~ 4 深夜
    // 5 ~ 7 清晨
    // 7 ~ 10 上午
    // 11 ~ 13 中午
    // 14 ~ 16 下午
    // 17 ~ 18 黄昏
    // 18 ~ 19 傍晚
    // 20 ~ 22 晚上
    // 22 ~ 24 夜间
    2022年12月24日 下午 19时30分40秒 -->
    <h1></h1>
</body>

</html>