JS 寫簡單的日曆

function initCalendar(){
    var nstr=new Date(); //當前Date資訊
    var ynow=nstr.getFullYear(); //年份
    var mnow=nstr.getMonth(); //月份
    var dnow=nstr.getDate(); //今日日期
    var n1str=new Date(ynow,mnow,1); //當月第一天Date資訊

    var firstday=n1str.getDay(); //當月第一天星期幾

    var m_days=new Array(31,28+is_leap(ynow),31,30,31,30,31,31,30,31,30,31); //各月份的總天數

    var tr_str=Math.ceil((m_days[mnow] + firstday)/7); //表格所須要行數

    //打印表格第一行（有星期標誌）
    var html="<table  align='center' width='220' cellspacing='0'><tr><td align='center'>日</td><td align='center'>一</td><td align='center'>二</td><td align='center'>三</td><td align='center'>四</td><td align='center'>五</td><td align='center'>六</td></tr>";

    
    for (i = 0; i < tr_str; i++) { //表格的行
            html += "<tr>";
            for (k = 0; k < 7; k++) { //表格每行的單元格
                idx = i * 7 + k; //單元格天然序列號
                date_str = idx - firstday + 1; //計算日期
                (date_str<=0 || date_str>m_days[mnow]) ? date_str = "&nbsp;"
                        : date_str = idx - firstday + 1; //過濾無效日期（小於等於零的、大於月總天數的）
                //打印日期：今天底色爲紅
                date_str == dnow ? html += "<td align='center'  class='sign_have'>"
                        + date_str + "</td>"
                        : html += "<td align='center'>" + date_str + "</td>";
            }
            html += "</tr>"; //表格的行結束
        }
        html += "</table>"; //表格結束
        $("#calendar").html(html);
    }

    function is_leap(year) {
        return (year % 100 == 0 ? res = (year % 400 == 0 ? 1 : 0)
                : res = (year % 4 == 0 ? 1 : 0));
    } //是否爲閏年

樣式：

.sign_have{
    background: rgba(0, 0, 0, 0) url("../p_w_picpaths/sign_have.gif") no-repeat scroll center center;
}
圖片見附件