JavaScript用户选择年月日输出是今年的第多少天

最新推荐文章于 2023-03-06 16:15:00 发布

@小匠

最新推荐文章于 2023-03-06 16:15:00 发布

阅读量329

点赞数

分类专栏： JavaStudy2020 文章标签： javascript

本文链接：https://blog.csdn.net/qq_45629145/article/details/110659344

版权

JavaStudy2020 专栏收录该内容

35 篇文章 1 订阅

订阅专栏

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

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>判断天数</title>

    <script>
        /**
         * 显示当前时间
         */
        function startTime() {
            var today = new Date();
            let year = today.getFullYear();
            let month = today.getUTCMonth() + 1; //因为js的getMonth方法的月份是从0开始的所以输出时要加1
            let day = today.getUTCDay() - 1; //返回值是 0（周日） 到 6（周六） 之间的一个整数。
            var h = today.getHours();
            var m = today.getMinutes();
            var s = today.getSeconds();// 在小于10的数字前加一个‘0’
            m = checkTime(m);
            s = checkTime(s);
            document.getElementById("txt").innerHTML = "当前日期：" + year + "年" + month + "月" + day + "日" +
                " 当前时间：" + h + ":" + m + ":" + s;
            t = setTimeout(function () {
                startTime()
            }, 500);
        }

        function checkTime(i) {
            if (i < 10) {
                i = "0" + i;
            }
            return i;
        }

        /**
         * 计算当前日期是当年的第多少天
         */
        function f() {
            let value = document.getElementById("date").value;
            let split = value.split("-");
            let year = split[0];
            let month = split[1];
            let day = split[2];
            let sum = Number(day);
            switch (month - 1) {
                case 11:
                    sum += 30;
                case 10:
                    sum += 31;
                case 9:
                    sum += 30;
                case 8:
                    sum += 31;
                case 7:
                    sum += 31;
                case 6:
                    sum += 30;
                case 5:
                    sum += 31;
                case 4:
                    sum += 30;
                case 3:
                    sum += 31;
                case 2:
                    sum += 28;
                case 1:
                    sum += 31;
                default:
                    if (year % 4 == 0 && year % 100 != 0 || year % 400 == 0) {
                        if (month <= 2) {
                            console.log("闰年天数为" + sum);
                            document.getElementById("h2").innerHTML = "今年是闰年，当前日期为今年的第：" + Number(sum) + "天";
                        } else {
                            console.log("闰年天数为" + Number(sum + 1));
                            document.getElementById("h2").innerHTML = "今年是闰年，当前日期为今年的第：" + Number(sum + 1) + "天";
                        }
                    } else {
                        console.log(sum);
                        document.getElementById("h2").innerHTML = "今年不是闰年，当前日期为今年的第：" + Number(sum) + "天";
                    }

            }

        }

    </script>
</head>
<body onload="startTime()">
<h1>输入年月日判断这是那一年的第几天</h1>
<h2 id="txt"></h2>
请选择：<input type="date" id="date" onblur="f()">
<h2 id="h2"></h2>
</body>
</html>