Membuat Jam Sederhana Dengan HTML Dan Javascript
Sesuai dengan judulnya jam sederhana ini hanya menggunakan html dan javascript. Langsung saja, silahkan buka notepad sobat dan pastekan script dibawah ini.
<!DOCTYPE html>
<html>
<head>
<title>Jam Digital Sederhana</title>
<script type="text/javascript">
// This function gets the current time and injects it into the DOM
function updateClock() {
// Gets the current time
var now = new Date();
// Get the hours, minutes and seconds from the current time
var hours = now.getHours();
var minutes = now.getMinutes();
var seconds = now.getSeconds();
// Format hours, minutes and seconds
if (hours < 10) {
hours = "0" + hours;
}
if (minutes < 10) {
minutes = "0" + minutes;
}
if (seconds < 10) {
seconds = "0" + seconds;
}
// Gets the element we want to inject the clock into
var elem = document.getElementById('clock');
// Sets the elements inner HTML value to our clock data
elem.innerHTML = hours + ':' + minutes + ':' + seconds;
}
</script>
</head>
<!--
This is the key to making the clock function.
When the page loads, it calls the javascript function "setInterval()",
which will call our function "updateClock()" once every 200 milliseconds.
-->
<body onload="setInterval('updateClock()', 200);">
<!-- This is the container for our clock, it can be any HTML element. -->
<h1 id="clock"></h1>
</body>
</html>
Simpan scrip tersebut sebagai jam.html.
Bagaimana.., gampang bukan...? Silahkan tambahkan css agar dapat membuat tampilannya lebih bagus lagi.
Baca Juga Button Menu Dengan HTML Dan Javascript
Demikian Cara Membuat Jam Sederhana Dengan HTML Dan Javascript, Semoga Bermanfaat