[JavaScript] 실시간 타이머(시계) 만들기[JavaScript] 실시간 타이머(시계) 만들기
Posted at 2019. 12. 5. 19:25 | Posted in JavaScript & jQuery/JavaScript■ 실시간 타이머(시계) 만들기
# 소스코드
<html> <head> <title>:: JavaScript 전광판 효과 ::</title> <script type="text/javascript"> document.addEventListener("DOMContentLoaded", function() { // 시간을 딜레이 없이 나타내기위한 선 실행 realTimer(); // 이후 0.5초에 한번씩 시간을 갱신한다. setInterval(realTimer, 500); }); // 시간을 출력 function realTimer() { const nowDate = new Date(); const year = nowDate.getFullYear(); const month= nowDate.getMonth() + 1; const date = nowDate.getDate(); const hour = nowDate.getHours(); const min = nowDate.getMinutes(); const sec = nowDate.getSeconds(); document.getElementById("nowTimes").innerHTML = year + "-" + addzero(month) + "-" + addzero(date) + " " + hour + ":" + addzero(min) + ":" + addzero(sec); } // 1자리수의 숫자인 경우 앞에 0을 붙여준다. function addzero(num) { if(num < 10) { num = "0" + num; } return num; } </script> </head> <body> <h1>■ 현재시간 : <span id="nowTimes"></span></h1> </body> </html> |
# 출력결과
'JavaScript & jQuery > JavaScript' 카테고리의 다른 글
| [JavaScript] 파일업로드시 용량 검사하기 (0) | 2019.12.26 |
|---|---|
| [JavaScript] 체크박스 전체 선택 - Sample (0) | 2019.12.19 |
| [JavaScript] 전광판 효과 구현하기 (0) | 2019.12.05 |
| [JavaScript] AJAX 통신 정리 (0) | 2019.11.17 |
| [JavaScript] 스크립트로 QR코드 스캔하고 데이터 읽기 (43) | 2019.06.13 |
