JavaScript/바닐라.js

실시간 가져오기[JavaScript]

충 민 2022. 9. 13. 16:24

setTimeout(showClock,1000) 로 재귀함수를 통해 1초마다 변경시켜준다 

 

<결과>

Document
현재 시간: 19시 34분 25초

 

[소스코드]

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        .clock{
            font-family: tahoma;
            font-size: 24pt;
            color: #006699;
        }
    </style>
    <script>
        function showClock(){
            var currentDate = new Date();
            var divClock = document.getElementById("divClock");

            var msg = '현재 시간: ' + currentDate.getHours() + "시 ";
            msg += currentDate.getMinutes() + "분 ";
            msg += currentDate.getSeconds() + "초 ";

            divClock.innerHTML = msg;
            
            setTimeout(showClock, 1000);
        }
    </script>
</head>
<body onload="showClock()">
    <div id="divClock" class="clock"></div>
</body>
</html>