시간(D-day)을 실시간으로 화면에 보여주기

시간을 실시간으로 보여주는 라이브러리 같은걸 쓰는줄 알았는데 너무 간단하게 setInterval을 사용했다.
각 요소를 계산하는 식은 메모해두고 쓰면 좋을듯하다.

$(document).ready(function () {
  const clock = $('.day_count .subtitle') // 텍스트를 추가할 노드
  function getTime() {
    const setDate = new Date("2021-06-07T09:00:00+0900"); // 기준이 되는 시각
    const now = new Date();
    const distance = now.getTime() - setDate.getTime();
    const hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
    const minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
    const seconds = Math.floor((distance % (1000 * 60)) / 1000);
    clock.text(`${hours < 10 ? `0${hours}` : hours}시간
${minutes < 10 ? `0${minutes}` : minutes}분
${seconds < 10 ? `0${seconds}` : seconds}초`)
  } // 여기서 삼항연산자의 true 부분을 보면 한번 더 ``로 감싸져있다. 0을 일반 스트링으로 넣기 위해 한번 더 `0${hours}`로 감싸주는듯 하다.

  function init() {
    setInterval(getTime, 1000);
  }

  init();
})