日历dom版(原创文章，转载请注明出处)
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>日历</title>
<script type="text/javascript">
var day;
function init()
{
//获取系统当前时间
var current=new Date();
var year=current.getYear();
var month=current.getMonth()+1;
var yearIndex;
var monthIndex;
//初始化年月
var dYear=document.getElementById("year");
var dMonth=document.getElementById("month");
for(var i=1970;i<2070;i++)
{
if(i==year)
{
yearIndex=dYear.length;
}
var op=new Option(i,i);
dYear.options[dYear.length]=op;
}
for(var j=1;j<13;j++)
{
if(j==month)
{
monthIndex=dMonth.length;
}
var op=new Option(j,j);
dMonth.options[dMonth.length]=op;
}
dYear.selectedIndex=yearIndex;
dMonth.selectedIndex=monthIndex;
printCanlender();
}
//判断平年闰年
function isLeapYear(year)
{
return ((year%4==0 && year%100!=0) ||year%400==0)?1:0;
}
//判断指定的天数
function everyMonthDays(year,month)
{
var arr=[31,28,31,30,31,30,31,31,30,31,30,31];
if(month!=2||isLeapYear(year)==0)
{
return arr[month-1];
}
return arr[month-1]+1;
}
//判断从公元元年到指定年第一天的天数
function partDays(year)
{
var days=365*year;
for(var i=1;i<year;i++)
{
days+=isLeapYear(i);
}
return days;
}
//计算总天数
function totalDays(year,month)
{
var days=partDays(year);
for(var i=1;i<month;i++)
{
days+=everyMonthDays(year,i);
}
return days;
}
//计算指定月第一天是星期几
function week(year,month)
{
var days=totalDays(year,month);
return days%7;
}
//打印
function printCanlender()
{
//获取要显示日历的div
var divCanlender=document.getElementById("divCan");
var year=document.getElementById("year").options[document.getElementById("year").selectedIndex].value;
var month=document.getElementById("month").options[document.getElementById("month").selectedIndex].value;
var weekDay=week(year,month);
//alert(weekDay);
var days=everyMonthDays(year,month);
day=1;
//使用数组存放周一到周日
var arrWeek=["星期日","星期一","星期二","星期三","星期四","星期五","星期六"];
//使用DOM创建一个表
var tb=document.createElement("table");
//使用DOM创建一个Tbody
var objTbody=document.createElement("tbody");
//创建一行七列
var objTr=document.createElement("tr");
for(var i=0;i<arrWeek.length;i++)
{
var objTd=document.createElement("td");
var objText=document.createTextNode(arrWeek[i]);
objTd.appendChild(objText);
objTr.appendChild(objTd);
}
//把创建好的行添加到tbody上
objTbody.appendChild(objTr);
for(var i=1;i<7;i++)
{
var objTrDay=document.createElement("tr");
for(var j=0;j<7;j++)
{
//在打印第一行的时候使用，并让j和weekDay只相等一次
if((j==weekDay)||(day<=days && day>1) )
{
//str+="<td>"+day+"</td>";
var objTdDay=document.createElement("td");
var objTextDay=document.createTextNode(day);
objTdDay.appendChild(objTextDay);
objTrDay.appendChild(objTdDay);
weekDay++;
day++;
}
/*else if(day<=days && day>1 )
{
weekDay++;
var objTdDay=document.createElement("td");
var objTextDay=document.createTextNode(day);
objTdDay.appendChild(objTextDay);
objTrDay.appendChild(objTdDay);
day++;
}*/
else
{
var objTdDay=document.createElement("td");
var objTextDay=document.createTextNode(" ");
objTdDay.appendChild(objTextDay);
objTrDay.appendChild(objTdDay);
}
}
objTbody.appendChild(objTrDay);
//str+="</tr>";
}
tb.appendChild(objTbody);
divCanlender.innerText="";
divCanlender.appendChild(tb);
}
</script>
</head>
<body onload="init()">
<div id="drop">
<span>年<select id="year" onchange="printCanlender()"></select></span><span>月<select id="month" onchange="printCanlender()"></select></span>
</div>
<div id="divCan">
</div>
</body>
</html>
