日历

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>

 


 
原文地址:https://www.cnblogs.com/zhou90/p/5984707.html