48 lines
955 B
HTML
48 lines
955 B
HTML
<!DOCTYPE HTML>
|
|
<html>
|
|
<head><meta charset="utf-8">
|
|
<style>
|
|
.hour { color: red }
|
|
.min { color: green }
|
|
.sec { color: blue }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
|
|
<div id="clock">
|
|
<span class="hour">hh</span>:<span class="min">mm</span>:<span class="sec">ss</span>
|
|
</div>
|
|
|
|
<script>
|
|
|
|
var timerId;
|
|
|
|
function update() {
|
|
var clock = document.getElementById('clock');
|
|
var date = new Date();
|
|
|
|
var hours = date.getHours();
|
|
if (hours < 10) hours = '0'+hours;
|
|
clock.children[0].innerHTML = hours;
|
|
|
|
var minutes = date.getMinutes();
|
|
if (minutes < 10) minutes = '0'+minutes;
|
|
clock.children[1].innerHTML = minutes;
|
|
|
|
var seconds = date.getSeconds();
|
|
if (seconds < 10) seconds = '0'+seconds;
|
|
clock.children[2].innerHTML = seconds;
|
|
}
|
|
|
|
function clockStart() {
|
|
setInterval(update, 1000);
|
|
update(); // <-- начать тут же, не ждать 1 секунду пока setInterval сработает
|
|
}
|
|
|
|
clockStart();
|
|
|
|
|
|
</script>
|
|
|
|
</body>
|
|
</html>
|