日历
js块调用下面代码 function ShowCalendar() { var firstDay = new Date(sameDay.getFullYear(), sameDay.getMonth(), 1); //获取本月第一天 var lastDay = new Date(sameDay.getFullYear(), sameDay.getMonth(), 0); //获取上月最后一天 var firstDayNumber = firstDay.getDate(); //获取当月第一天的数字 var lastDayNumber = lastDay.getDate(); //获取上月最后一天的数字 var day = new Date(sameDay.getFullYear(), sameDay.getMonth() + 1, 0); //获取本月最后一天 var dayByWeek = firstDay.getDay(); //获取本月第一天 星期X(0-6,0代表星期天) var daycount = day.getDate();//获取本月最后一天的数字 $("#calContentMain").empty(); var i; if (dayByWeek > 0) { for (i = 0; i < dayByWeek; i++) { var index = lastDayNumber - dayByWeek + i + 1; $("#calContentMain").append(" <li class=\"gray\">" + index + "</li>"); } } for (i = 1; i <= daycount; i++) { $("#calContentMain").append(" <li>" + i + "</li>"); } var lastDayByWeek = day.getDay();//获取本月最后一天 星期X(0-6,0代表星期天) for (i = 1; i <= 6 - lastDayByWeek; i++) { $("#calContentMain").append("<li class=\"gray\">" + i + "</li>"); } }
<ul class="cal-content-header clearfix"> <li class="red">周日</li> <li>周一</li> <li>周二</li> <li>周三</li> <li>周四</li> <li>周五</li> <li class="red">周六</li> </ul> <div class="clearfix"></div> <ul class="cal-content-main clearfix" id="calContentMain"> </ul>