其实我是一个对时间和日期不怎么感兴趣的人,小学的时候感觉时间或者日期那块就让我很晕,因为有时候是100进制有时候是60进制,搞的我对日历一直很不感兴趣,最近不知道为什么想写一个日历了,可想而知,这个玩意对我的大脑会造成多大的伤害,很简单的.
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>日历</title> <style type="text/css"> *{ margin:0; padding:0; list-style:none;} </style> </head> <body> <div id="can" style="border-bottom:1px solid #ccc; border-right:1px solid #ccc; width:357px; overflow:hidden; float:left; margin:100px;"> </div> </body> </html> <script type="text/javascript"> var obj=document.getElementById("can"); var oDl=document.createElement("dl"); var arrWeek=["星期日","星期一","星期二","星期三","星期四","星期五","星期六"] for(var i=0;i<7;i++){ var oDt=document.createElement("dt"); oDt.style.background="#f2f2f2"; oDt.style.width=50+"px"; oDt.style.height=30+"px"; oDt.style.textAlign="center"; oDt.style.lineHeight=30+"px"; oDt.style.fontSize=13+"px"; oDt.style.borderWidth=1+"px"; oDt.style.borderColor="#ccc"; oDt.style.borderStyle="solid"; oDt.style.borderRight="none"; oDt.style.borderBottom="none"; oDt.style.cssFloat="left"; oDt.innerHTML=arrWeek[i]; oDl.appendChild(oDt); } for(var i=0;i<42;i++){ var oDt=document.createElement("dd"); oDt.style.width=50+"px"; oDt.style.height=30+"px"; oDt.style.textAlign="center"; oDt.style.lineHeight=30+"px"; oDt.style.fontSize=13+"px"; oDt.style.borderWidth=1+"px"; oDt.style.borderColor="#ccc"; oDt.style.borderStyle="solid"; oDt.style.borderRight="none"; oDt.style.borderBottom="none"; oDt.style.cssFloat="left"; oDl.appendChild(oDt); } obj.appendChild(oDl); var aDd=obj.getElementsByTagName("dd"); var d=new Date(); var y=d.getFullYear(); var m=d.getMonth(); var da=d.getDate(); var d2=new Date(y,m,0); var d3=new Date(y,m+1,0); var md=d3.getDate(); var d2w=d2.getDay(); for(var i=0;i<md+d2w+1;i++){ if(i<d2w || i==d2w){ aDd[i].innerHTML=""; }else{ if(i-d2w==da){ aDd[i].style.backgroundColor="#aaa" } aDd[i].innerHTML=i-d2w; } } </script>
当然,这个只是一个简单到简陋,简陋到我估计都不能使用了,哈哈,爱好而已