HTML + CSS + JS 연습예제

시계 만들기

ella
ella   Link

# 실시간 시계 만들기

<div id="clock"></div>
#clock {
  border: 10px solid blueviolet;
  border-radius: 40px;
  text-align: center;
  width: 500px;
  line-height: 50px;
  font-size: 50px;
  margin: auto;
}
function setClock() {
  const now = new Date()
  const s = now.getHours() + ':' + now.getMinutes() + ':' + now.getSeconds()
  document.getElementById('clock').innerHTML = s
  // setTimeout (지정한 시간마다 특정 함수를 실행 시켜줌.)
  setTimeout('setClock()', 1000) // 1000 : 1초 지정해줌
  console.log(now.getSeconds()) // 매 초마다 콘솔에 찍힘.
}

setClock()