Making a JS Clock
1120 ワード
setInterval(function, 1000)
-> 함수들을 몇초 간격으로 실행할 것인지에 관한 함수
clockTitle.innerHTML =
`${hours < 10 ? `0${hours}` : hours} :
${minutes < 10 ? `0${minutes}` : minutes} :
${seconds < 10 ? `0${seconds}` : seconds}`;
삼항 조건 연산자 => 미니if 를 사용하여 false/true 이용가능
아니면 한번에 hours,minutes,seconds 한번에 고치는 함수
function formatTime(hms, limit = 10){
if(hms < limit){
result = `0${hms}`;
} else {
result = `${hms}`;
}
return result;
}
clockTitle.innerText =
`${formatTime(hours)}:${formatTime(minutes)}:
${formatTime(seconds)}`;
***총 코드***
const clockContainer = document.querySelector(#js-clock),
clockTitle = colckContainer.querySelector("h1");
function getTime(){
const date = new Date();
const hours = date.getHours();
const minutes = date.getMinutes();
const seconds = date.getSeconds();
clockTitle.innerText =
`${hours < 10 ? `0${hours}` : hours} :
${minutes < 10 ? `0${minutes}` : minutes} :
${seconds < 10 ? `0${seconds}` : seconds
}`;
}
function init(){
getTime();
setInterval(getTime, 1000);
}
init();
Reference
この問題について(Making a JS Clock), 我々は、より多くの情報をここで見つけました https://velog.io/@seoha23/Making-a-JS-Clockテキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol