【Javascript】カレンダー(基本)-現在日付のカレンダー
<html> <head><title>Javascript-カレンダー(基本)-現在日付のカレンダー</title> <script type="text/javascript"> <!-- function calendar(){ var vToday = new Date(); var vWeekTbl = new Array("日","月","火","水","木","金","土"); var vMonthTbl= new Array(31,28,31,30,31,30,31,31,30,31,30,31); var vYear = vToday.getYear(); vYear = (vYear<2000) ? (1900+vYear) : (vYear); if (((vYear%4)==0 && (vYear%100)!=0) || (vYear%400)==0) // うるう年チェック vMonthTbl[1] = 29; var vMonth = vToday.getMonth(); var vCurrentDay = vToday.getDate(); vToday.setDate(1); vWeek = vToday.getDay(); var vTblLine = Math.ceil((vWeek+vMonthTbl[vMonth])/7); // カレンダーの行数 vTable = new Array(7*vTblLine); for(i=0; i < 7 * vTblLine; i++) vTable[i] = " "; // vTableを掃除する for(i=0; i < vMonthTbl[vMonth]; i++) vTable[i+vWeek] = i+1; var vTbl = document.createElement("TABLE"); vTbl.setAttribute("border",1); vTbl.setAttribute("cellSpacing",0); vTbl.setAttribute("borderColor","#808080"); vTbl.setAttribute("borderColordark","##000000"); vTbl.setAttribute("borderColorlight","#C0C0C0"); var vTBody = document.createElement("TBODY"); //--> TITLE START var vTR = document.createElement("TR"); var vTD = document.createElement("TD"); vTD.setAttribute("align","center"); vTD.setAttribute("colSpan","7"); vTD.setAttribute("bgColor","#7fffd4"); var vTD_Text = document.createTextNode(vYear + "年" + (vMonth+1) + "月カレンダー"); vTD.appendChild(vTD_Text); vTR.appendChild(vTD); vTBody.appendChild(vTR); //<-- TITLE END //--> 曜日START vTR = document.createElement("TR"); for(i=0; i < vWeekTbl.length; i++){ vTD = document.createElement("TD"); if(i == 6) vTD.style.color="blue"; if(i == 0) vTD.style.color="red"; vTD.setAttribute("align","center"); vTD.appendChild(document.createTextNode(vWeekTbl[i])); vTR.appendChild(vTD); } vTBody.appendChild(vTR); //<-- 曜日END //--> カレンダーSTART for(i=0; i < vTblLine; i++){ vTR = document.createElement("TR"); for(j=0; j < 7; j++){ vTD = document.createElement("TD"); if(j == 6) vTD.style.color="blue"; if(j == 0) vTD.style.color="red"; vTD.setAttribute("align","center"); vTD_Text = document.createTextNode(vTable[j+(i*7)]); if(vCurrentDay == vTable[j+(i*7)]) vTD.setAttribute("bgColor","yellow"); vTD.appendChild(vTD_Text); vTR.appendChild(vTD); } vTBody.appendChild(vTR); } //<-- カレンダーEND vTbl.appendChild(vTBody); divCalendar.appendChild(vTbl); } //--> </script> </head> <body leftmargin="0" topmargin="0" onLoad="calendar()"> <div id="divCalendar"></div> </body> </html>