HTML日历是网页设计中非常常见的功能,它可以帮助用户方便地查看某一天的日期。在网页上使用HTML日历,需要使用JavaScript来实现日历的功能。
<script type="text/javascript"> var monthNames = ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"]; var date = new Date(); var d = date.getDate(); var m = date.getMonth(); var y = date.getFullYear(); var firstDay = new Date(y, m, 1).getDay(); function drawCalendar() { var html = "<table><tr><th>星期日</th><th>星期一</th><th>星期二</th><th>星期三</th><th>星期四</th><th>星期五</th><th>星期六</th></tr>"; var date = 1; for(var i = 0; i < 6; i++) { html += "<tr>"; for(var j = 0; j < 7; j++) { if(i == 0 && j < firstDay) { html += "<td></td>"; } else if(date > daysInMonth(m, y)) { break; } else { html += "<td onclick='alert("'+monthNames[m]+' '+date+', '+y+'")'>" + date + "</td>"; date++; } } html += "</tr>"; } html += "</table>"; document.getElementById('calendar').innerHTML = html; } function daysInMonth(m, y) { return 32 - new Date(y, m, 32).getDate(); } </script>
在以上的代码中,我们首先定义了月份的名称,以及当前年月日。然后,我们通过计算当前月份的第一天是星期几,来确定日历的第一行应该从星期几开始填充日期。接着,我们通过一个for循环来描绘整个日历,其中我们使用嵌套的for循环来循环每一行和每一列,以填充日期。如果某一天是当前月份的第一天且不是星期日,则利用一个空