背景:花了几天时间开发了一个含农历的万年历,虽然还存在一些问题但基本功能都已实现。可能代码并不是很简洁,清晰。仅作为参考。
一、HTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<link type="text/css" rel="stylesheet" href="calen.css" />
</head>
<body>
<div class="calendar">
<div class="cale_head">
<div class="control year_control">
<a href="#" class="icon prev"></a>
<div class="year">
<i class="trigger"></i>
<div class="cale_year cale_field"></div>
</div>
<a href="#" class="icon next"></a>
<ul class="year_list"></ul>
</div>
<div class="control month_control">
<a href="#" class="icon prev"></a>
<div class="month">
<i class="trigger"></i>
<div class="cale_month cale_field"></div>
</div>
<a href="#" class="icon next"></a>
<ul class="month_list"></ul>
</div>
<div class="control holiday_control">
<div class="holiday">
<i class="trigger"></i>
<div class="cale_holiday cale_field">2016年假日安排</div>
</div>
<ul class="holiday_list"><li class="hlist">2016年假日安排</li><li>元旦</li><li>春节</li><li>清明节</li><li>劳动节</li><li>端午节</li><li>中秋节</li><li>国庆节</li></ul>
</div>
<div class="control btn_today">返回今天</div>
<div class="time_panel">
北京时间: <span class="time"></span>
</div>
</div>
<div class="cale_main">
<div class="cale_left">
<ul class="weeks">
<li class="days">日</li>
<li class="days">一</li>
<li class="days">二</li>
<li class="days">三</li>
<li class="days">四</li>
<li class="days">五</li>
<li class="days">六</li>
</ul>
<ul class="date">
</ul>
</div>
<div class="cale_right">
<div class="date_bar">
<span class="cur_date"></span>
<span class="cur_weekday"></span>
</div>
<div class="cur_day"></div>
<div class="lunar_bar">
<div class="lunar_date"></div>
<div class="lunar_animal"></div>
</div>
</div>
</div>
</div>
<script type="text/javascript" src="calen.js"></script>
</body>
</html>
二、css
*{
margin:0;
padding:0;
}
body{
font-family:arial;
font-size:12px;
}
ul,li{
list-style:none;
}
.calendar{
width:580px;
margin:0 auto;
border:1px solid #dddddd;
}
.cale_head{
width:100%;
height:42px;
border-bottom:1px solid #dddddd;
line-height:40px;
background:#eeeeee;
box-sizing:border-box;
}
.control{
float:left;
border:1px solid #dddddd;
height:20px;
line-height:20px;
margin:10px 5px;
background-color:#FFFFFF;
zoom:1;
position:relative;
cursor:pointer;
}
.icon{
width:14px;
height:20px;
float:left;
}
.trigger{
float:right;
width:14px;
height:12px;
background:url(image/icon.gif) no-repeat left -55px;
}
.cale_field{
float:left;
margin:0 5px;
}
.year_control .prev{
background:url(image/icon.gif) no-repeat left top;
}
.year_control .year{
float: left;
height: 12px;
line-height: 12px;
padding: 4px 5px;
padding-bottom: 0;
border-left: 1px solid #c9cccf;
border-right: 1px solid #c9cccf;
white-space:nowrap;
}
.year_control .next{
background:url(image/icon.gif) no-repeat left -25px;
}
.year_list{
display:none;
width:74px;
height:160px;
position:absolute;
left:14px;
top:20px;
background:#FFFFFF;
border-bottom:1px solid #dddddd;
border-left:1px solid #dddddd;
border-right:1px solid #dddddd;
overflow:auto;
}
.year_list li{
width:57px;
text-align:center;
color:#999999;
}
.year_list li:hover{
background:#0078B3;
color:#FFFFFF;
}
.month_control .prev{
background:url(image/icon.gif) no-repeat left top;
}
.month_control .month{
float: left;
height: 12px;
line-height: 12px;
padding: 4px 5px;
padding-bottom: 0;
border-left: 1px solid #c9cccf;
border-right: 1px solid #c9cccf;
white-space:nowrap;
width:50px;
}
.month_control .next{
background:url(image/icon.gif) no-repeat left -25px;
}
.month_list{
display:none;
width:53px;
height:160px;
position:absolute;
left:14px;
top:20px;
background:#FFFFFF;
border-bottom:1px solid #dddddd;
border-left:1px solid #dddddd;
border-right:1px solid #dddddd;
overflow:auto;
}
.month_list li{
width:36px;
text-align:center;
color:#999999;
}
.month_list li:hover{
background:#0078B3;
color:#FFFFFF;
}
.holiday_control .holiday{
float: left;
height: 12px;
line-height: 12px;
padding: 4px 5px;
padding-bottom: 0;
white-space: nowrap;
width:112px;
text-align:center;
}
.holiday_list{
display:none;
width:122px;
height:160px;
position:absolute;
left:-1px;
top:20px;
background:#FFFFFF;
border-bottom:1px solid #dddddd;
border-left:1px solid #dddddd;
border-right:1px solid #dddddd;
overflow:auto;
}
.holiday_list li{
width:122px;
text-align:center;
color:#999999;
}
.holiday_list .hlist{
background:#0078B3;
color:#FFFFFF;
}
.holiday_list li:hover{
background:#0078B3;
color:#FFFFFF;
}
.btn_today{
height: 12px;
line-height: 12px;
padding: 4px 5px;
}
.time_panel{
float: right;
width: 125px;
height: 20px;
color: #999;
white-space: nowrap;
margin-right:10px;
}
.cale_main{
overflow:hidden;
}
.cale_left{
width:420px;
overflow:hidden;
border:none;
margin:0;
float:left;
}
.cale_left .days{
box-sizing:border-box;
border-bottom:1px solid #CCCCCC;
border-right:1px solid #CCCCCC;
width:60px;
height:40px;
float:left;
line-height:40px;
text-align:center;
background:#fefbeb;
}
.cale_left .date li{
width:60px;
height:60px;
float:left;
box-sizing:border-box;
border-bottom:1px solid #CCCCCC;
border-right:1px solid #CCCCCC;
cursor:pointer;
}
.cale_left .date li h6{
text-align:center;
font-size:18px;
line-height:30px;
}
.cale_left .date li span{
display:block;
text-align:center;
}
.cale_right{
width:160px;
height:200px;;
float:left;
border-bottom:1px solid #CCCCCC;
}
.cale_right .date_bar{
width:100%;
height:50px;
line-height:50px;
text-align:center;
font-size:12px;
font-family:Arial;
}
.cale_right .date_bar .cur_date{
margin-right:5px;
}
.cale_right .cur_day{
width:100%;
height:80px;
line-height:80px;
font-size:60px;
color: #c00;
text-align:center;
}
.cale_right .lunar_bar{
width:100%;
height:60px;
font-size:14px;
text-align:center;
color:#999999;
}
.cale_right .lunar_bar .lunar_date{
height:30px;
line-height:30px;
}
.cale_right .lunar_bar .lunar_animal{
height:30px;
line-height:30px;
}
三、js
var oTime=document.getElementsByClassName('time')[0];
var oYearControl=document.getElementsByClassName('year_control')[0];
var oYear=document.getElementsByClassName('year')[0];
var oYearList=document.getElementsByClassName('year_list')[0];
var oMonthControl=document.getElementsByClassName('month_control')[0];
var oMonth=document.getElementsByClassName('month')[0];
var oMonthList=document.getElementsByClassName('month_list')[0];
var oHoliday=document.getElementsByClassName('holiday')[0];
var oHolidayList=document.getElementsByClassName('holiday_list')[0];
var oHolidayLi=oHolidayList.getElementsByTagName('li');
var oBtnToday=document.getElementsByClassName('btn_today')[0];
var oDate=document.getElementsByClassName('date')[0];
var oCurYear=document.getElementsByClassName('cale_year')[0];
var oCurMonth=document.getElementsByClassName('cale_month')[0];
var oCurHoliday=document.getElementsByClassName('cale_holiday')[0];
var oCurDate=document.getElementsByClassName('cur_date')[0];
var oCurWeekday=document.getElementsByClassName('cur_weekday')[0];
var oCurDay=document.getElementsByClassName('cur_day')[0];
var oLunarDate=document.getElementsByClassName('lunar_date')[0];
var oLunarAnimal=document.getElementsByClassName('lunar_animal')[0];
var gregoDay=[31,28,31,30,31,30,31,31,30,31,30,31];
var lunarInfo=[
0x04bd8,0x04ae0,0x0a570,0x054d5,0x0d260,0x0d950,0x16554,0x056a0,0x09ad0,0x055d2,
0x04ae0,0x0a5b6,0x0a4d0,0x0d250,0x1d255,0x0b540,0x0d6a0,0x0ada2,0x095b0,0x14977,
0x04970,0x0a4b0,0x0b4b5,0x06a50,0x06d40,0x1ab54,0x02b60,0x09570,0x052f2,0x04970,
0x06566,0x0d4a0,0x0ea50,0x06e95,0x05ad0,0x02b60,0x186e3,0x092e0,0x1c8d7,0x0c950,
0x0d4a0,0x1d8a6,0x0b550,0x056a0,0x1a5b4,0x025d0,0x092d0,0x0d2b2,0x0a950,0x0b557,
0x06ca0,0x0b550,0x15355,0x04da0,0x0a5d0,0x14573,0x052d0,0x0a9a8,0x0e950,0x06aa0,
0x0aea6,0x0ab50,0x04b60,0x0aae4,0x0a570,0x05260,0x0f263,0x0d950,0x05b57,0x056a0,
0x096d0,0x04dd5,0x04ad0,0x0a4d0,0x0d4d4,0x0d250,0x0d558,0x0b540,0x0b5a0,0x195a6,
0x095b0,0x049b0,0x0a974,0x0a4b0,0x0b27a,0x06a50,0x06d40,0x0af46,0x0ab60,0x09570,
0x04af5,0x04970,0x064b0,0x074a3,0x0ea50,0x06b58,0x055c0,0x0ab60,0x096d5,0x092e0,
0x0c960,0x0d954,0x0d4a0,0x0da50,0x07552,0x056a0,0x0abb7,0x025d0,0x092d0,0x0cab5,
0x0a950,0x0b4a0,0x0baa4,0x0ad50,0x055d9,0x04ba0,0x0a5b0,0x15176,0x052b0,0x0a930,
0x07954,0x06aa0,0x0ad50,0x05b52,0x04b60,0x0a6e6,0x0a4e0,0x0d260,0x0ea65,0x0d530,
0x05aa0,0x076a3,0x096d0,0x04bd7,0x04ad0,0x0a4d0,0x1d0b6,0x0d250,0x0d520,0x0dd45,
0x0b5a0,0x056d0,0x055b2,0x049b0,0x0a577,0x0a4b0,0x0aa50,0x1b255,0x06d20,0x0ada0,
0x14b63,0x09370,0x049f8,0x04970,0x064b0,0x168a6,0x0ea50,0x06b20,0x1a6c4,0x0aae0,
0x0a2e0,0x0d2e3,0x0c960,0x0d557,0x0d4a0,0x0da50,0x05d55,0x056a0,0x0a6d0,0x055d4,
0x052d0,0x0a9b8,0x0a950,0x0b4a0,0x0b6a6,0x0ad50,0x055a0,0x0aba4,0x0a5b0,0x052b0,
0x0b273,0x06930,0x07337,0x06aa0,0x0ad50,0x14b55,0x04b60,0x0a570,0x054e4,0x0d160,
0x0e968,0x0d520,0x0daa0,0x16aa6,0x056d0,0x04ae0,0x0a9d4,0x0a2d0,0x0d150,0x0f252,
0x0d520];
var gregoDay=[31,28,31,30,31,30,31,31,30,31,30,31];
var Animals=["鼠","牛","虎","兔","龙","蛇","马","羊","猴","鸡","狗","猪"];
var solarTerm =["小寒","大寒","立春","雨水","惊蛰","春分","清明","谷雨","立夏","小满","芒种","夏至","小暑","大暑","立秋","处暑","白露","秋分","寒露","霜降","立冬","小雪","大雪","冬至"];
var sTermInfo=[0,21208,42467,63836,85337,107014,128867,150921,173149,195551,218072,240693,263343,285989,308563,331033,353350,375494,397447,419210,440795,462224,483532,504758];
var nStr1=['日','一','二','三','四','五','六','七','八','九','十'];
var nStr2=['初','十','廿','卅',' '];
//国历节日
var sFtv =["0101 元旦","0214 情人节","0308 妇女节","0312 植树节","0315 消费者权益日","0401 愚人节","0501 劳动节","0504 青年节","0512 护士节","0601 儿童节","0701 建党节","0801 建军节","0910 教师节","0928 孔子诞辰","1001 国庆节","1006 老人节","1024 联合国日","1224 平安夜","1225 圣诞节"];
//农历节日
var lFtv = ["0101 春节","0115 元宵节","0505 端午节","0707 七夕情人节","0715 中元节","0815 中秋节","0909 重阳节","1208 腊八节","1224 小年","0100 除夕"];
//一位数变成两位数
function twoNum(num){
if(num<10)
return "0"+num;
return num;
}
//获得当前时间
function getCurTime(){
var date=new Date();
var hour=date.getHours();
var minute=date.getMinutes();
var second=date.getSeconds();
return twoNum(hour)+":"+twoNum(minute)+":"+twoNum(second);
}
oTime.innerHTML=getCurTime();
setInterval(function(){oTime.innerHTML=getCurTime();},1000);
//列表点击显现,消失
function listEvent(object){
if(object.style.display == 'none'){
object.style.display='block';
}
else{
object.style.display='none';
}
}
listEvent(oYearList);
listEvent(oMonthList);
listEvent(oHolidayList);
//年份,月份,节日点击事件
oYear.onclick=function(ev){
listEvent(oYearList);
oMonthList.style.display='none';
oHolidayList.style.display='none';
var y=parseInt(oCurYear.innerHTML);
oYearList.scrollTop=(y-1900-2)*20;
ev.stopPropagation();
}
oMonth.onclick=function(ev){
listEvent(oMonthList);
oYearList.style.display='none';
oHolidayList.style.display='none';
var m=parseInt(oCurMonth.innerHTML);
oMonthList.scrollTop=(m-1-2)*20;
ev.stopPropagation();
}
oHoliday.onclick=function(ev){
listEvent(oHolidayList);
oYearList.style.display='none';
oMonthList.style.display='none';
for(var i=0; i<oHolidayLi.length; i++){
oHolidayLi[i].className='';
if(oHolidayLi[i].innerHTML == oCurHoliday.innerHTML){
oHolidayLi[i].className='hlist';
}
}
ev.stopPropagation();
}
//返回今天
oBtnToday.onclick=function(){
oYearList.style.display='none';
oMonthList.style.display='none';
oHolidayList.style.display='none';
}
oBtnToday.onclick=function(){
var date=new Date();
var year=date.getFullYear();
var month=date.getMonth();
oCurYear.innerHTML=year+'年';
oCurMonth.innerHTML=month+1+'月';
oDate.innerHTML='';
outGregoDay(year,month+1);
}
//创建年份列表
function createYearList(n){
var date=new Date();
var year=date.getFullYear();
var month=date.getMonth();
oCurYear.innerHTML=year+'年';
oCurMonth.innerHTML=month+1+'月';
for(var i=1900; i<=2100; i++){
var oLi=document.createElement('li');
oLi.innerHTML=i+'年';
if(oLi.innerHTML == oCurYear.innerHTML){
oLi.style.background='#0078B3';
oLi.style.color='#ffffff';
}
oYearList.appendChild(oLi);
}
oLi=oYearList.getElementsByTagName('li');
for(var i=0; i<oLi.length; i++){
oLi[i].onclick=function(){
oDate.innerHTML='';
oCurYear.innerHTML=this.innerHTML;
var y=parseInt(oCurYear.innerHTML);
var m=parseInt(oCurMonth.innerHTML);
outGregoDay(y,m);
for(var j=0; j<oLi.length; j++){
oLi[j].style.color='#999999';
oLi[j].style.background='';
}
this.style.background='#0078B3';
this.style.color='#FFFFFF';
}
}
var oPre=oYearControl.getElementsByClassName('prev')[0];
var oNext=oYearControl.getElementsByClassName('next')[0];
oPre.onclick=function(){
oDate.innerHTML='';
var y = oCurYear.innerHTML;
y=parseInt(y)-1;
if(y<1900)
y=1900;
oCurYear.innerHTML=y+"年";
var m=parseInt(oCurMonth.innerHTML);
outGregoDay(y,m);
}
oNext.onclick=function(){
oDate.innerHTML='';
var y = oCurYear.innerHTML;
y=parseInt(y)+1;
if(y>2100)
y=2100;
oCurYear.innerHTML=y+"年";
var m=parseInt(oCurMonth.innerHTML);
outGregoDay(y,m);
}
}
createYearList(100);
//创建月份列表
document.addEventListener('click',function(){
oYearList.style.display='none';
oMonthList.style.display='none';
oHolidayList.style.display='none';
},false);
function createMonthList(){
for(var i=1; i<=12; i++){
var oLi=document.createElement('li');
oLi.innerHTML=i+'月';
if(oLi.innerHTML == oCurMonth.innerHTML){
oLi.style.background='#0078B3';
oLi.style.color='#ffffff';
}
oMonthList.appendChild(oLi);
}
oLi=oMonthList.getElementsByTagName('li');
for(var i=0; i<oLi.length; i++){
oLi[i].onclick=function(){
oDate.innerHTML='';
oCurMonth.innerHTML=this.innerHTML;
var y=parseInt(oCurYear.innerHTML);
var m=parseInt(oCurMonth.innerHTML);
outGregoDay(y,m);
for(var j=0; j<oLi.length; j++){
oLi[j].style.color='#999999';
oLi[j].style.background='';
}
this.style.background='#0078B3';
this.style.color='#FFFFFF';
}
}
var oPre=oMonthControl.getElementsByClassName('prev')[0];
var oNext=oMonthControl.getElementsByClassName('next')[0];
oPre.onclick=function(){
oDate.innerHTML='';
var m = oCurMonth.innerHTML;
var y=parseInt(oCurYear.innerHTML);
m=parseInt(m)-1;
if(m<1){
m=12;
y--;
oCurYear.innerHTML=y+'年';
}
oCurMonth.innerHTML=m+"月";
outGregoDay(y,m);
}
oNext.onclick=function(){
oDate.innerHTML='';
var m = oCurMonth.innerHTML;
var y=parseInt(oCurYear.innerHTML);
m=parseInt(m)+1;
if(m>12){
m=1;
y++;
oCurYear.innerHTML=y+'年';
}
oCurMonth.innerHTML=m+"月";
outGregoDay(y,m);
}
}
createMonthList();
//节日列表
function createHolidayList(){
for(var i=0; i<oHolidayLi.length; i++){
oHolidayLi[i].onclick=function(){
oCurHoliday.innerHTML=this.innerHTML;
}
}
}
createHolidayList();
//获取公历某年某月的天数
function getGregoDay(y,m){
if(m==1){
if((y%4==0) && (y%100!=0) || (y%400 == 0))
return 29;
else
return 28;
}
else
return(gregoDay[m]);
}
//获取某年某月的第一天是星期几
function getOneDay(y,m){
var day = new Date(y,m,1);
var days=day.getDay()
return days;
}
//输出公历农历日期
function outGregoDay(y,m){
var days=getOneDay(y,m-1);
var n=days;
var dayNum=getGregoDay(y,m-1);
var preDays=getGregoDay(y,m-2)
var tmp1=sTerm(y,2*m-2);
var tmp2=sTerm(y,2*m-1);
while(n>0){
var aLi=document.createElement('li');
aLi.innerHTML='';
aLi.style.background='#EEEEEE';
oDate.appendChild(aLi);
n--;
}
for(var i=1; i<=dayNum; i++){
var lunarDay = lunarDate(y,m,i);
var aLi=document.createElement('li');
var x=i+days;
if(i==tmp1)
aLi.innerHTML="<h6>"+i+"</h6><span style='color:#8eb475'>"+solarTerm[(m-1)*2]+"</span>";
else if(i==tmp2)
aLi.innerHTML="<h6>"+i+"</h6><span style='color:#8eb475'>"+solarTerm[(m-1)*2+1]+"</span>";
else{
aLi.innerHTML="<h6>"+i+"</h6><span>"+toLunarDay(lunarDay.year,lunarDay.month,lunarDay.day)+"</span>";
}
for (var j=0;j<sFtv.length;j++){ //公历节日
if (parseInt(sFtv[j].substr(0,2))==(m)){
if (parseInt(sFtv[j].substr(2,4))==(i)){
aLi.innerHTML="<h6>"+i+"</h6><span style='color:#86a9c0'>"+sFtv[j].substr(5)+"</span>";
}
}
}
for (var k=0;k<lFtv.length;k++){ //农历节日
if (parseInt(lFtv[k].substr(0,2))==(lunarDay.month)){
if (parseInt(lFtv[k].substr(2,4))==(lunarDay.day)){
aLi.innerHTML="<h6>"+i+"</h6><span style='color:#b04343'>"+lFtv[k].substr(5)+"</span>";
}
}
if (12==(lunarDay.month)){ //判断是否为除夕
var eve = leapMonth(lunarDay.year)? leapDay(lunarDay.year): monthDay(lunarDay.year,lunarDay.month);
if (eve==(lunarDay.day)){
aLi.innerHTML="<h6>"+i+"</h6><span style='color:#b04343'>除夕</span>";
}
}
}
//alert(aLi.getElementsByTagName('h6'))
if(x%7 ==0 || x%7==1)
aLi.getElementsByTagName('h6')[0].style.color='#b04343';
oDate.appendChild(aLi);
}
var restNum=42-days-dayNum;
while(restNum>0){
var aLi=document.createElement('li');
aLi.innerHTML='';
aLi.style.background='#eeeeee';
oDate.appendChild(aLi);
restNum--;
}
today(y,m);
}
outGregoDay(2016,4);
//得到今天的日期
function today(y,m){
var date=new Date();
var year=date.getFullYear();
var month=date.getMonth()+1;
var day=date.getDate();
var days=getOneDay(y,m-1);
var num=getGregoDay(y,m-1);
var curYear=parseInt(oCurYear.innerHTML);
var curMonth=parseInt(oCurMonth.innerHTML);
var aLi=oDate.getElementsByTagName('li');
for(var i=days; i<num+days; i++){
aLi[i].onclick=function(){
for(var j=days; j<num+days; j++){
aLi[j].style.backgroundColor='#FFFFFF';
}
var curDay=this.getElementsByTagName('h6')[0].innerHTML;
addDate(curYear,curMonth,curDay);
this.style.backgroundColor='#FBFCD6';
}
}
if(curYear==year){
if(curMonth==month){
for(var i=days; i<num+days; i++){
if(i==day){
aLi[i-1+days].style.background='url(image/biaoji.gif) no-repeat top center';
}
}
}
}
}
//农历某年某月的天数
function monthDay(y,m){
return( (lunarInfo[y-1900] & (0x10000>>m))? 30: 29 );
}
//农历y年哪一个月是闰月
function leapMonth(y){
return(lunarInfo[y-1900]&0xf);
}
//农历获得闰月的天数
function leapDay(y){
if(leapMonth(y))
return((lunarInfo[y-1900] & 0x10000)? 30: 29);
else
return 0;
}
//获得农历y年的天数
function yearDay(y){
var sum=0;
for(var i=1; i<=12; i++){
sum+=monthDay(y,i);
}
if(leapMonth(y))
sum+=leapDay(y);
return sum;
}
//根据公历得到农历
function lunarDate(y,m,d){
if(y<1900 || y>2100){
return;
}
var temp=0;
var objDate = new Date(y,m-1,d);
var baseDate = new Date(1900,0,31);
var offset = (objDate - baseDate)/86400000;
for(var i=1900; i<2100 && offset>0; i++){
temp=yearDay(i);
offset-=temp;
}
if(offset<0){
offset += temp;
i--;
}
var year=i;
var leap=leapMonth(i);
var isLeap = false;
for(i=1; i<13 && offset>0; i++) {
if(leap>0 && i==(leap+1) && isLeap==false){
--i;
isLeap = true;
temp = leapDay(year);
}
else{
temp = monthDay(year,i);
}
if(isLeap==true && i==(leap+1))
isLeap = false;
offset -= temp;
}
if(offset==0 && leap>0 && i==leap+1){
if(this.isLeap){
isLeap = false;
}
else{
isLeap = true;
--i;
}
}
if(offset<0){
offset += temp;
--i;
}
month = i
day = offset + 1
return {'year':year,'month':month,'day':day};
}
//农历月
function toLunarMonth(month){
var arr=['一','二','三','四','五','六','七','八','九','十','十一','十二'];
return arr[month-1];
}
//将数字变成中文日期
function toLunarDay(year,month, day){
if(day==1)
return toLunarMonth(month)+"月";
else if(day<=10&&day>1)
return nStr2[0]+nStr1[day];
else if(day>10&&day<20)
return nStr2[1]+nStr1[day-10]
else if(day>20&& day<30)
return nStr2[2]+nStr1[day-20];
else if(day==20)
return "二十";
else if(day==30)
return "三十";
}
//节气
function sTerm(y,n) {
var offDate = new Date( ( 31556925974.7*(y-1900) + sTermInfo[n]*60000 ) + Date.UTC(1900,0,6,2,5) )
return(offDate.getUTCDate())
}
//侧边工具栏
function addDate(y,m,d){
var date = new Date(y,m-1,d);
var year=date.getFullYear();
var month=date.getMonth();
var day=date.getDate();
var week=date.getDay();
var lunarDay;
oCurDate.innerHTML=year+"-"+month+"-"+day;
oCurWeekday.innerHTML="星期"+nStr1[week];
oCurDay.innerHTML=day;
var lunar = lunarDate(year,month+1,day);
if(lunar.day==1){
lunarDay="初一" ;
}
else {
lunarDay=toLunarDay(lunar.year,lunar.month,lunar.day);
}
oLunarDate.innerHTML = "农历"+toLunarMonth(lunar.month)+"月"+lunarDay;
oLunarAnimal.innerHTML=Animals[(2016-4)%12+1]+"年";
}
addDate(2016,4,14);
四、效果展示