자바스크립트 - 실제 달력을 만들어보자~!!

안녕하세요

이번 시간에는 자바스크립트에서 실제 달력을 만들어 보는 시간을 갖겠습니다.

보시다시피 위의 두 개의 버튼이 있습니다.

각각의 버튼을 누르면 해당 날짜가 보여지는 예제입니다.

var btn=document.getElementById('btn1');
btn1.onclick=function(){
 var year=2016;
 var month=9;
 
 show(year,month);
}
var btn2=document.getElementById('btn2');
btn2.onclick=function(){
 var year=2017;
 var month=2;
 
 show(year,month);
}
function show(year,month){
 var total_days; // 각 달의 총 일수
 switch(month)
 {
  case 1: case 3: case 5: case 7:
  case 8: case 10: case 12:
  total_days=31; break;
  case 4 : case 6: case 9:
  case 11:
  total_days=30; break;
  /*윤년(29일)
    1)기원 연수가 4로 나누어 떨어지는 해를 우선 윤년(29일)
    2)그 중에서 100으로 나누어 떨어지는 해는 평년(28일)
    3)다만 400으로 나누어 떨어지는 윤년(29일)
    */
  case 2 :{
   if(year%4==0 && year%100!=0 || year%400==0){
    total_days=20;
   }
   else
    total_days=28;
  }break;

아래의 소스는 이미지로 보여드리겠습니다.

직접 보고 이해하면서 타이핑 해주세요~!