Creating a Basic Watch Using JavaScript #coding #javascript

Posted by

Simple Watch Make Through JavaScript

Simple Watch Make Through JavaScript

Today, we will be creating a simple watch using JavaScript. This watch will display the current time and update every second.

Let’s start by creating the basic structure of our watch in HTML:

<div id="watch">
  <span id="hour">00</span> : <span id="minute">00</span> : <span id="second">00</span>
</div>

Next, we will use JavaScript to update the time on our watch:

<script>
  function updateTime() {
    const now = new Date();
    const hour = String(now.getHours()).padStart(2, '0');
    const minute = String(now.getMinutes()).padStart(2, '0');
    const second = String(now.getSeconds()).padStart(2, '0');
    
    document.getElementById('hour').innerText = hour;
    document.getElementById('minute').innerText = minute;
    document.getElementById('second').innerText = second;
  }
  
  setInterval(updateTime, 1000);
</script>

That’s it! Our simple watch is now ready. You can copy and paste the above code into an HTML file and open it in your browser to see the watch in action.

This is just a basic example, but you can customize and enhance it further by adding styling, animations, or additional functionality. Have fun coding!