Nomad-Momentum-2) clock

이은지·2022년 10월 30일
0

시계 만들기

  1. website가 load 될때 시계가 나오고 매초마다 다시 실행됨
  2. 초 단위가 2자리로 나오게 표시

코드 - clock.js

const clock = document.querySelector("h2#clock");

function getClock() {
  const date = new Date();
  //padStart : 현재 문자열의 시작을 다른 문자열로 채워준다
  //한자리수인 문자열을 두자리로 보이기 위해서
  const hours = String(date.getHours()).padStart(2, "0");
  const minutes = String(date.getMinutes()).padStart(2, "0");
  const seconds = String(date.getSeconds()).padStart(2, "0");
  clock.innerHTML = `${hours}:${minutes}:${seconds}`;
}

//website가 load되자마자 getClock()을 실행하고
//매초마다 다시 실행되도록
getClock();
setInterval(getClock, 1000);

정리

setInterval(function, 5000) : function 함수를 5초뒤에 실행 (계속 반복실행)
setTimeout(function, 5000) : function 함수를 5초뒤에 실행 (반복하지 않음)
new Date() : 현재 시간과 날짜를 표시

0개의 댓글