1. 예제) Date 객체를 이용하여 타이머를 만들어보자

1.1 먼저 수능 D-Day 카운터스러운 UI를 만들어보자(자유!!)

예시화면

예시화면

UI를 다 만들었으면 이제 수능까지 남은 D-Day를 구해보자 !!

Untitled

Untitled

이런식으로 응용하여 Text에 ddays를 넣으면 ??

Untitled

아쉽게도 수능날까지의 시간에서 오늘까지의 시간을 뺀 값이 나와버립니다..

그러면 이제 이 밀리초 단위를 일 단위로 바꿔야겠죠..

한 번 고민해봅시다 어떻게 하면 이 밀리초 단위를 일 단위로 바꿀 수 있을 지 !


자 이제는 고정된 값이 아니라 사용자가 원하는 날을 기준으로 D-Day 카운터를 만들어봅시다

html 파일에 form 태그를 추가해봅시다

<form>
        <input type="text" id="name" placeholder="디데이 이름 입력">
        <input type="date" id="date">
        <input type="button" value="디데이 계산">
</form>

이제 우리가 해야 될 것 :