[자바스크립트]setInterval를 이용한 타이머 만들기

안녕하세요 오늘은 setInterval을 이용해서 타이머를 만들어보겠습니다.

우선 타이머를 만들기 위해서는 Date 객체를 알아야 합니다.

Date객체는 var date = new Date()로 선언하시면 되는데 이 객체로 현재 연, 월, 일, 시간등을 알 수 있습니다.

Date 객체의 메소드	설명
getFullYear()	현재 연도를 반환해준다.
getMonth()	월을 반환해준다. 다만 1월을 0으로 12월을 11로 반환해주니 주의.
getDate()	현재 일을 반환해준다.
getDay()	요일을 반환해준다. 0(일요일)부터 6(토요일) 사이의 값으로 반환.
getHousr()	시간을 리턴해준다.
getMinutes()	분을 반환해준다.
getSeconds()	초를 반환해준다.

이 표는 Date 객체의 메소드들입니다. 참고하시라고 가져왔습니다.

코드입니다. 각각의 변수들에 값을 넣어주고, 12시가 넘었을 경우에는 12를 빼주고 오후, 아니면 오전을 표시하는 if문, 요일을 

표시하기 위한 switch문, 현재 월을 정상적으로 표시하기 위한 month+1 등이 보입니다.

또한 타이머를 삽입하기 위해서 InnerHTML을 사용했는데, getElementById를 사용해 body 부분의 div의 내용을 가져옵니다. 그리고 그 

안에 대입하는 것이죠.

출력 결과입니다.

1초마다 반복해서 불러오는 것을 확인할 수 있습니다.