可完全定制的Javascript日历 （Callback 实现）

采用Callback的方式，回调生成样式。
所以只要自己编写简单的 CalendarStyle， 就可以生成完全定制的Javascript日历。
具体代码如下：

<div id="calendar">&nbsp;</div>

<script language="javascript">
var c = new Calendar(new CalendarStyle());
var h1 = c.buildWeek(["SUN", "MON", "TUS", "WED", "THU", "FRI", "STA"]);
var h2 = c.build();
var table = "<TABLE border=1 cellpadding=4 cellspacing=2>";
calendar.innerHTML = c.sb(table, h1, h2, "</table>");

function CalendarStyle() {
    this.line = function(c, begin) {
        return (begin) ? "<tr valign=middle>" : "</tr>";
    };
   
    this.week = function(c, w) {
        return c.sb('<TD class="tdDateBack" width="45px"><DIV align="center" class="black bold">', w, "</td>");
    };
   
    this.day = function(c, d, pos) {
        if (pos != 0) return "<td>&nbsp;</td>";
       
        var cday = c.sb(d.getFullYear(), c.fullday(d.getMonth()+1), c.fullday(d.getDate()));
        var day = c.fullday(d.getDate());
        if (d.getDay() == 0 ) {
             day = "<font color=red>" + day + "</font>";
        }
        return c.sb("<td align=center>", day, "</td>");
    };
}


function Calendar(style) {
    var now = new Date();
    this.year = now.getFullYear();
    this.month = now.getMonth() + 1;
    this.style = style;
    
    this.build = function(year, month) {
        this.year = year || this.year;
        this.month = month || this.month;

        var daysInMonth=[31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
        if (this.isLeapYear(this.year)) daysInMonth[1] = 29;
        var maxdays = daysInMonth[this.month-1];
        
        var firstDate = new Date(this.year, this.month-1, 1);
        var week = firstDate.getDay();
        var startDay = 1 - week;
        
        var ndays = maxdays + week;
        if (ndays > 35) ndays = 42;
        else if (ndays > 28) ndays = 35;

        var HTML = "";
        for (var i=0, n=startDay; i<ndays; i++, n++) {
            if (i % 7 == 0)
                HTML += this.style.line(this, true);
            var dayPos = (n<=0) ? -1 : (n>maxdays) ? 1: 0;
            HTML += this.style.day(this, _setDay(firstDate,n), dayPos);
            if (i % 7 == 6)
                HTML += this.style.line(this, false);
        }
        return HTML;
    };

    this.buildWeek = function (weekNames) {
         var HTML = "";
         HTML += this.style.line(this, true);
         for (var i=0; i<weekNames.length; i++) {
            HTML += this.style.week(this, weekNames[i]);
         }
         HTML += this.style.line(this, false);
         return HTML;
    };

    /**
     * prev year  : buildDiff(-1, 0)
     * next year  : buildDiff(1, 0)
     * prev month : buildDiff(0, -1)
     * next month : buildDiff(0, 1)
     */
    this.buildDiff = function (yeardiff, monthdiff) {
        this.year += yeardiff;
        this.month += monthdiff;
        return this.build();
    };

    this.isLeapYear = function (year) {
        year = year || this.year;
        return ((year%4==0) && (year%100!=0)) || (year%400==0);
    };
    
    // concat string
    this.sb = function () {
        var s = "";
        for (var i=0; i<arguments.length; i++) {
            s += arguments[i];
        }
        return s;
    };
    
    // "9" => "09"
    this.fullday = function (day) {
        return  (day<10) ? "0"+day : ""+day;
    };
     
    _setDay = function (d, day) {
        return new Date(d.getFullYear(), d.getMonth(), day);
    };
}

</script>