!!! <style> .calendar { width: 320px; background: #fafafa; padding: 10px; border-radius: 8px; font-family: Arial, sans-serif; } .calendar-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; } .calendar-header select { font-size: 14px; } .calendar table { width: 100%; border-collapse: collapse; text-align: center; } .calendar th { background: #eee; padding: 5px; } .calendar td { padding: 8px; height: 36px; } .calendar .today { background: #4CAF50; color: #fff; border-radius: 50%; } </style> <div class="calendar"> <div class="calendar-header"> <select id="yearSel"></select> <select id="monthSel"></select> </div> <table> <thead> <tr> <th>日</th><th>一</th><th>二</th><th>三</th><th>四</th><th>五</th><th>六</th> </tr> </thead> <tbody id="calendarBody"></tbody> </table> </div> <script> (function () { var yearSel = document.getElementById("yearSel"); var monthSel = document.getElementById("monthSel"); var tbody = document.getElementById("calendarBody"); var now = new Date(); var year = now.getFullYear(); var month = now.getMonth(); // 初始化年份 for (var y = 2000; y <= 2100; y++) { var opt = document.createElement("option"); opt.value = y; opt.text = y + " 年"; if (y === year) opt.selected = true; yearSel.appendChild(opt); } // 初始化月份 for (var m = 0; m < 12; m++) { var opt = document.createElement("option"); opt.value = m; opt.text = (m + 1) + " 月"; if (m === month) opt.selected = true; monthSel.appendChild(opt); } function render() { var y = Number(yearSel.value); var m = Number(monthSel.value); var firstDay = new Date(y, m, 1).getDay(); var days = new Date(y, m + 1, 0).getDate(); var html = "<tr>"; for (var i = 0; i < firstDay; i++) html += "<td></td>"; for (var d = 1; d <= days; d++) { if ((firstDay + d - 1) % 7 === 0 && d !== 1) html += "</tr><tr>"; var cls = (y === now.getFullYear() && m === now.getMonth() && d === now.getDate()) ? "today" : ""; html += "<td class='" + cls + "'>" + d + "</td>"; } html += "</tr>"; tbody.innerHTML = html; } yearSel.onchange = render; monthSel.onchange = render; render(); })(); </script> !!! 日一二三四五六 赞 区区凡人的点赞？罢了，本魔王就勉为其难收下啦！