一款很漂亮的带时间的月历
<script type="text/javascript"> //用于存放每个月的天数的数组 function monthArrays(m0, m1, m2, m3, m4, m5, m6, m7, m8, m9, m10, m11){ this[0] = m0; this[1] = m1; this[2] = m2; this[3] = m3; this[4] = m4; this[5] = m5; this[6] = m6; this[7] = m7; this[8] = m8; this[9] = m9; this[10] = m10; this[11] = m11; } //实现月历功能 function calendar(){ var today = new Date(); var year = today.getYear()+1900; //取得本年的年份。比如今天2011年01月15号，那么year=2011 var month = today.getMonth(); //取得0~~11标记的月份。比如今天2011年01月15号，那么month=0 var day = today.getDate(); //取得当天的日期。比如今天2011年01月15号，那么day=15 var week = today.getDay(); //取得0~~6标记的星期。比如今天2011年01月15号，那么week=6 var weekNames = new Array("星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"); var monthNames = new Array("01月", "02月", "03月", "04月", "05月", "06月", "07月", "08月", "09月", "10月", "11月", "12月"); var monthDays = new monthArrays(31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31); //标记每月的天数的数组 if (((year%4 == 0) && (year%100 != 0)) || (year%400 == 0)){ monthDays[1] = 29; //闰年的二月份共有29天 } document.write("<div id='rili' style='position:absolute; width:140px;'>"); document.write("<table width='217' border='0' cellspacing='0' cellpadding='2' bgcolor='#0080FF'>"); document.write("<tr><td><table border='0' cellspacing='1' cellpadding='2' bgcolor='Silver'>"); document.write("<tr><th colspan='7' bgcolor='#C8E3FF'>"); /*注意，在Firefox中，下面的year=2011，而在InternetExplorer中，year=3911*/ document.writeln("<font style='font-size:9pt; color:#330099'>" + "公元" + year + "年" + monthNames[month] + day + "日 " + weekNames[week] + "</font>"); document.writeln("</th></tr><tr><th bgcolor='#0080FF'><font style='font-size:9pt; color:White'>日</font></th>"); document.writeln("<th bgcolor='#0080FF'><font style='font-size:9pt; color:White'>一</font></th>"); document.writeln("<th bgcolor='#0080FF'><font style='font-size:9pt; color:White'>二</font></th>"); document.writeln("<th bgcolor='#0080FF'><font style='font-size:9pt; color:White'>三</font></th>"); document.writeln("<th bgcolor='#0080FF'><font style='font-size:9pt; color:White'>四</font></th>"); document.writeln("<th bgcolor='#0080FF'><font style='font-size:9pt; color:White'>五</font></th>"); document.writeln("<th bgcolor='#0080FF'><font style='font-size:9pt; color:White'>六</font></th>"); document.writeln("</tr><tr>"); column = 0; for (i=0; i<week; i++) { document.writeln("<td><font style='font-size:9pt'> </font></td>"); column++; } for (i=1; i<=monthDays[month]; i++) { if(i==day){ document.writeln("</td><td align='center' bgcolor='#FF8040'><font style='font-size:9pt; color:#ffffff'>") }else{ document.writeln("</td><td bgcolor='#FFFFFF' align='center'><font style='font-size:9pt; font-family:Arial; font-weight:bold; color:#330066'>"); } document.writeln(i); if(i==day){ document.writeln("</form></td>"); } column++; if(column==7){ document.writeln("<tr>"); column = 0; } } document.writeln("<tr><td colspan='7' align='center' valign='top' bgcolor='#0080FF'>") document.writeln("<form name='clock' onSubmit='0'><font style='font-size:9pt; color:#ffffff'>") document.writeln("当前时间 <input type='Text' name='face' align='top'></font></form></td></tr></table>") document.writeln("</td></tr></table></div>"); } </script> <script type="text/javascript"> var timerID = null; var timerRunning = false; function stopclock(){ if(timerRunning){ clearTimeout(timerID); } timerRunning = false; } function showtime(){ var now = new Date(); var hours = now.getHours(); //获取当前时间中的小时 var minutes = now.getMinutes(); //获取当前时间中的分钟 var seconds = now.getSeconds(); //获取当前时间中的秒数 var timeValue = " " + hours; timeValue += ((minutes<10) ? ":0" : ":") + minutes; //使用三目运算符重新构造时间中分钟的显示方式 timeValue += ((seconds<10) ? ":0" : ":") + seconds; timeValue += (hours>=12) ? " 下午" : " 上午"; document.clock.face.value = timeValue; timerID = setTimeout("showtime()", 1000);//设置超时,使时间动态显示 timerRunning = true; } function startclock(){ stopclock(); showtime(); //显示当前时间 } </script> <body onLoad="startclock(); timerONE=window.setTimeout"> <script language="JavaScript"> calendar(); </script> </body>