메뉴 건너뛰기

조회 수 10061 추천 수 0 댓글 0
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄
<!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" lang="ko" xml:lang="ko">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title> 달력만들기 </title>
<script type="text/javascript">
//<![CDATA[

function printCalendar(y, m) {    
    
    //① 현재 날짜와 현재 달에 1일의 날짜 객체를 생성합니다.
    var date=new Date(); //날짜 객체 생성
    var nowY=date.getFullYear(); //현재 연도
    var nowM=date.getMonth(); //현재 월
    var nowD=date.getDate(); //현재 일
    
    y = (y != undefined)?y:nowY;
    m = (m != undefined)?m-1:nowM;
        
    /* 현재 월의 1일에 요일을 구합니다. 
     그럼 그달 달력에 첫 번째 줄 빈칸의 개수를 구할 수 있습니다.*/

    var theDate=new Date(y, m, 1); 
    var theDay=theDate.getDay();

    //② 현재 월에 마지막 일을 구해야 합니다.

    //1월부터 12월까지 마지막 일을 배열로 저장함.
    var last=[31,28,31,30,31,30,31,31,30,31,30,31];
    /*현재 연도가 윤년(4년 주기이고 100년 주기는 제외합니다. 
    또는 400년 주기)일경우 2월에 마지막 날짜는 29가 되어야 합니다.*/

    if(y%4 == 0 && y % 100 !=0 || y%400 == 0) lastDate=last[1]=29;

    var lastDate=last[m]; //현재 월에 마지막이 몇일인지 구합니다.

    /*③ 현재 월의 달력에 필요한 행의 개수를 구합니다.
    var row(행의 개수)= Math.ceil( (theDay(빈 칸)+lastDate(월의 전체 일수)) / 7)*/


    var row=Math.ceil((theDay+lastDate)/7); //필요한 행수
    
    //④ 달력 년도/월 표기 및  달력 테이블 생성
    document.write("<h2>"+y+"."+(m+1)+"</h2>");
    //문자결합 연산자를 사용해 요일이 나오는 행을 생성    

    var calendar="<table border='1'>";
    calendar+="<tr>";
    calendar+="<th>일</th>";
    calendar+="<th>월</th>";
    calendar+="<th>화</th>";
    calendar+="<th>수</th>";
    calendar+="<th>목</th>";
    calendar+="<th>금</th>";
    calendar+="<th>토</th>";
    calendar+="</tr>";

    var dNum=1;
    //이중 for문을 이용해 달력 테이블을 생성
    for(var i=1; i<=row; i++){//행 생성 (tr 태그 생성)
    calendar+="<tr>";

    for(var k=1; k<=7; k++){//열 생성 (td 태그 생성)        
        /*행이 첫 줄이고 현재 월의 1일의 요일 이전은 모두 빈열로
        표기하고 날짜가 마지막 일보다 크면 빈열로 표기됩니다.*/

        if(i==1 && k<=theDay || dNum>lastDate){
          calendar+="<td> &nbsp; </td>";
         }else{
          calendar+="<td>"+dNum+"</td>";
           dNum++;
         }
    }
    calendar+="<tr>";
    }    

    //⑤ 문자로 결합된 달력 테이블을 문서에 출력
    document.write(calendar);
}

printCalendar();
//printCalendar(2012,2);

//]]>
</script>
</head>
<body>

</body>
</html>



List of Articles
번호 제목 날짜 조회 수
207 적용이 간편한 [글목록 인쇄] 등 특정 영역 인쇄하기 팁 2014.02.27 5441
206 자주쓰는 것들 2021.03.26 203
205 자바스크립트에서 이벤트 중단 하는 방법 2021.03.25 321
204 자바스크립트로 네트워크 연결 확인하기 (Navigator onLine Property) file 2015.06.19 6197
203 자바스크립트, javascript, 간단한 파일 확장자 검사후 retur 2014.03.01 5434
202 자바스크립트 이벤트 목록입니다. ( javascript event ) 2015.04.06 5596
201 자바스크립트 영문입력, 숫자만입력, 한글만 입력, 붙여넣기 방지 2015.02.02 10179
200 자바스크립트 아이디 기억하기 기능 구현 (쿠키저장) file 2015.06.19 10924
199 자바스크립트 실행 시간 측정 2016.12.22 8930
198 자바스크립트 소수점 자리수 계산 2014.03.01 6897
197 자바스크립트 변수,함수,객체의 표현 2016.12.22 5369
196 자바스크립트 배열 중복값 다루기 2018.10.27 3898
195 자바스크립트 및 CSS를 이용한 숫자만 입력받기 2016.12.22 6321
194 자바스크립트 모음 2016.12.22 5778
193 자바스크립트 개체 복사 2014.02.27 6573
192 자바스크립트 urlencode(), urldecode(), rawurlencode(), rawurldecode() 2018.10.27 1913
191 자바스크립트 API 문서 2015.06.19 9086
190 자바 스크립트 confirm()함수에서 (확인,취소) -> (예,아니오) file 2014.03.01 10210
189 입력된 폼의 내용 똑같이 복사 file 2014.03.01 6892
188 입력된 글씨수 제어 file 2014.03.01 6700
Board Pagination Prev 1 2 3 4 5 6 7 8 9 10 ... 13 Next
/ 13

하단 정보를 입력할 수 있습니다

© k2s0o1d4e0s2i1g5n. All Rights Reserved