JavaScript_clock

1. Intervals

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

function sayHello(){
    console.log("hello");
}
//5초마다 함수 호출
setInterval(sayHello, 5000);

2. clock 구현

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

function getClock(){
    const date = new Date();
    clock.innerText=`${date.getHours()}:${date.getMinutes()}:${date.getSeconds()}`
}
getClock();
setInterval(getClock,1000);

3. padStart 사용해서 원하는 clock 형태로 출력

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

function getClock(){
    const date = new Date();
    // String이 가져와야할 길이를 2로 정하고 남은 앞쪽은 "0"으로 채움.
    // padStart 반대는 padEnd
    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.innerText= `${hours}:${minutes}:${seconds}`;
}
getClock();
setInterval(getClock,1000);