电子日历的设计与实现
功能要求：设计一款简单的电子日历，要求实现显示当天所在月份的全部日期，并且可以通过点击按钮控件切换月份。
实现效果图：
一、界面设计
1.使用<div>标签划分区域
1)状态栏，左右两边是上/下个月按钮，中间是当前的年份和月份；
2)日历最上面一行的星期名称，从周日到周六依次填入；
3)用于显示当前月份的所有日期的区域。
2.制作状态栏
1)使用<button>标签制作按钮;
2)继续使用<div>标签制作年份和月份的显示牌。
3.制作显示星期的横栏
1)该区域分为7个小区域，分别显示周一至周日的名称。
二、显示状态栏中年份和月份
1.计算当前月份的总天数
1)自定义函数count()
2.计算当前月份的第一天是星期几
//获取本月第一天的日期对象var firstdate = new Date(year, month - 1, 1);//推算本月第一天是星期几var xiqi = firstdate.getDay();
3.月份的全部日期
1)自定义函数showDate()
三、按钮控件功能实现
1.往前翻月份的效果实现（上个月）
1）自定义函数lastMonth()
2.往后翻月份的效果实现（下个月）
1）自定义函数nextMonth()
四、完整代码
<html><head><title>简单电子日历的设计与实现</title><meta charset="utf-8"><link rel="stylesheet" href="css/calendar.css"><script src="js/calendar.js"></script></head><body onload="showDate()"><h3>简单电子日历的设计与实现</h3><hr /><div id="calendar"><!--状态栏--><div><!--显示上个月按钮--><button onclick="lastMonth()">上个月</button><!--显示当前年份和月份--><div id="month"></div><!--显示下个月按钮--><button onclick="nextMonth()">下个月</button></div><!--显示星期几--><div><div class="everyday">日</div><div class="everyday">一</div><div class="everyday">二</div><div class="everyday">三</div><div class="everyday">四</div><div class="everyday">五</div><div class="everyday">六</div></div><!--显示当前月份每天的日期--><div id="day"></div></div></body></html>
部分js代码
function count() {if (month != 2) {if ((month == 4) || (month == 6) || (month == 9) || (month == 11)) {allday = 30;//4、6、9、11月份为30天} else {allday = 31;//其他月份为31天（不包括2月份）}} else {//如果是2月份需要判断当前是否为闰年if (((year % 4) == 0 && (year % 100) != 0) || (year % 400) == 0) {allday = 29;//闰年的2月份是29天} else {allday = 28;//非闰年的2月份是28天}}}
function showMonth() {var year_month = year + "年" + month + "月";document.getElementById("month").innerHTML = year_month;}
备注：完整版请下载附件
/download/YQEMMMM/12973209
