메뉴 건너뛰기

조회 수 10063 추천 수 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>



  1. No Image 22Dec
    by
    2016/12/22 Views 8162 

    setTimeout() / clearTimeout() / setInterval()

  2. 드롭다운 메뉴를 만들어보자! -1탄

  3. No Image 06Apr
    by
    2015/04/06 Views 8206 

    2단계 트리메뉴 마우스오버(mouseover), 온포커스(onfocus) 구현

  4. No Image 22Dec
    by
    2016/12/22 Views 8376 

    [단축키 설정 자바스크립트]shortcut.js

  5. No Image 03Feb
    by
    2015/02/03 Views 8500 

    페이지 로드 할때 컨트롤에 포커스 주기

  6. Location 객체 - URL 파싱 - URL에서 전달인자 추출하기 함수 작성

  7. No Image 19Feb
    by
    2017/02/19 Views 8526 

    [INPUT BOX] 텍스트박스(INPUT 박스) 가 동적으로 추가,삭제됩니다

  8. No Image 19Jun
    by
    2015/06/19 Views 8577 

    마우스 드래그, 오른쪽 팝업메뉴, 선택 막기 (IE11, 파이어폭스, 크롬 확인)

  9. No Image 17Mar
    by
    2014/03/17 Views 8698 

    특정부위 마우스 오버시 설명을 보여주는 소스

  10. No Image 01Mar
    by
    2014/03/01 Views 8794 

    주민등록번호로 성별/나이/연령대 구분

  11. No Image 22Dec
    by
    2016/12/22 Views 8930 

    자바스크립트 실행 시간 측정

  12. No Image 03Feb
    by
    2015/02/03 Views 9038 

    5초후 자동으로 창닫기

  13. No Image 19Jun
    by
    2015/06/19 Views 9088 

    자바스크립트 API 문서

  14. No Image 17Mar
    by
    2014/03/17 Views 9362 

    이미지 마우스 드래그로 스크롤을 움직이는 소스

  15. No Image 19Jun
    by
    2015/06/19 Views 9407 

    location.href 로 새창 여는 방법 (target=_blank 효과)

  16. 'onmouseover', 마우스 오버 효과 - 글씨 바꾸기!

  17. No Image 17Nov
    by
    2016/11/17 Views 9821 

    javascript 화면 캡쳐

  18. Javascript selectbox selected 컨트롤

  19. No Image 19Jun
    by 조쉬
    2015/06/19 Views 10063 

    예제 - 자바스크립트로 현재 달의 달력 만들기 (calendar)

  20. No Image 02Feb
    by
    2015/02/02 Views 10181 

    자바스크립트 영문입력, 숫자만입력, 한글만 입력, 붙여넣기 방지

Board Pagination Prev 1 ... 4 5 6 7 8 9 10 11 12 13 Next
/ 13

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

© k2s0o1d4e0s2i1g5n. All Rights Reserved