<title>經(jīng)典的JS日歷</title>
<STYLE>
body { background-color:#202020;}
td { font-family:Tahoma;font-size:11px;}
.calendarTable { background-color:#494949;}
.calendarNav { background-color:#000000;color:white;text-align:center;height:18px;}
.calendarNavEnglish { color:white;text-align:center;}
.calendarNavBar { font-size:10px;cursor:hand;color:#A5BEA5;}
.calendarHeadTR { background-color:#494949;text-align:center;color:#B9B9B9;height:17px;}
.calendarHeadTR td { width:28px;}
.calendarMainTR { background-color:#333333;text-align:center;color:#B9B9B9;height:17px;}
.calendarMainTR td { width:28px;}
.calendarToday { background-color: #636563;color:#FFFF00;width:90%;height:90%;font-weight:bolder;}
</STYLE>
<SCRIPT LANGUAGE="JavaScript" DEFER>
Date.prototype.getLastDay = function(year,month) {
    if(arguments.length==2)
  return(new Date(year,month+1,0).getDate())
 else
  with(new Date())return(new Date(getYear(),getMonth(),0).getDate())
}
Date.prototype.FirstDayofWeek = function(year,month) {
    if(arguments.length==2)
  return(new Date(year,month,1).getDay())
 else
  with(new Date())return(new Date(getYear(),getMonth(),1).getDay());
}
//Call
calendar(new Date().getYear(),new Date().getMonth(),new Date().getDate())
function calendar(userY,userM,userD) {
//system variable
var i,j;
var now = new Date(userY,userM,userD);
var Year = now.getYear();
var Month = now.getMonth()+1;
var LastDay = now.getLastDay(userY,userM);
var FirstDayofWeek = now.FirstDayofWeek(userY,userM);
var Today = now.getDate();
var MonthName = ["January","February","March","April","May","June","July","August","September","October","November","December"]
var WeekName = ["Sun","Mon","Tur","Wed","Thu","Fri","Sat"]
//user variable
var firstDayInWeek=7
var calendarRows = 7,calendarCols=7;
//user color
var tableCellpadding=1,tableCellspacing=1,tableBorder=0;
//append to where
oWhere = document.body;
//Create Table
var calendarTable = document.createElement("table");
//創(chuàng)建導(dǎo)航
var calendarNavTR = calendarTable.insertRow();
var calendarNavTD = calendarNavTR.insertCell();
//嵌套表格
var NavInnerTable = document.createElement("table")
var NavInnerTR = NavInnerTable.insertRow();
for (var i=0;i<3;i++)NavInnerTR.insertCell();
var NavSpanpY = document.createElement("<span>");
var NavSpanpM = document.createElement("<span>");
var NavSpannY = document.createElement("<span>");
var NavSpannM = document.createElement("<span>");
with(NavInnerTR.cells) {
 item([0]).appendChild(NavSpanpY);
 item([0]).appendChild(NavSpanpM);
 item([2]).appendChild(NavSpannM);
 item([2]).appendChild(NavSpannY);
 //顯示英文提示
 item([1]).innerText = MonthName[Month-1]+" "+Year;
 item([1]).width = "100%";
 item([1]).className = "calendarNavEnglish";
 //
 item([0]).className = "calendarNavBar";
 item([2]).className = "calendarNavBar";
}
calendarNavTD.appendChild(NavInnerTable);
//創(chuàng)建日歷頭部分
var calendarMainTR = new Array();
for (i=0;i<calendarRows;i++) {
 calendarMainTR[i] = calendarTable.insertRow();
 for (j=0;j<calendarCols;j++)calendarMainTR[i].insertCell();
}
//表格屬性
with(calendarTable) {
 cellPadding=tableCellpadding;
 cellSpacing=tableCellspacing;
 border=tableBorder;
 className="calendarTable";
}
//導(dǎo)航內(nèi)容
with(NavSpanpY) {
 innerHTML = "<<"
 onclick = function() {deleteCalendar();calendar(Year-1,Month-1,new Date().getDate())}
}
with(NavSpanpM) {
 innerHTML = " <"
 onclick = function() {deleteCalendar();calendar(Year,Month-2,new Date().getDate())}
}
with(calendarNavTD) {
 colSpan = 7;
 className = "calendarNav";
}
with(NavSpannM) {
 innerHTML = "> "
 onclick = function() {deleteCalendar();calendar(Year,Month,new Date().getDate())}
}
with(NavSpannY) {
 innerHTML = ">>"
 onclick = function() {deleteCalendar();calendar(Year+1,Month-1,new Date().getDate())}
}
//日歷頭
var calendarHeadTR = calendarMainTR[0];
with(calendarHeadTR) {
 for (i=0;i<cells.length;i++)cells[i].innerText=WeekName[i];
 className="calendarHeadTR";
}
//日歷主體
var k=1;
for (i=1;i<calendarMainTR.length;i++) {
 calendarMainTR[i].className="calendarMainTR";
 for(j=0;j<calendarMainTR[i].cells.length;j++) {
  if (i==1&&j==FirstDayofWeek) {
   CreateDay();
   k++;
  } else if (k>1&&k<=LastDay) {
   CreateDay();
   k++;
  }
 }
}
deleteNoneRow();
oWhere.appendChild(calendarTable);
/*Function*/
 //日歷日期
 function CreateDay() {
  if (k==Today) {
   var todaySpan = document.createElement("span");
   todaySpan.className = "calendarToday";
   todaySpan.innerText = k;
   calendarMainTR[i].cells[j].appendChild(todaySpan);
  } else {
   calendarMainTR[i].cells[j].innerText=k;
  }
 }
 //刪除空行
 function deleteNoneRow() {
  if(!calendarTable.rows[6].innerText)calendarTable.deleteRow(6);
  if(!calendarTable.rows[7].innerText)calendarTable.deleteRow(7);
 }
 //從頁面里移除日歷
 function deleteCalendar() {
  if(calendarTable)calendarTable.outerHTML="";
 }
}
</SCRIPT>