What line of code would allow me to update a function every second?

Question

I just wanted to make a simple clock that tells you the time and not date. The problem with the code below though is that it shows the exact time of when the .html file is opened.

<body onload="showTime()">
<p id="time"</p>
<script>
var seconds;
var minutes;
var hours;
var time;

function showTime() {
    seconds = getSeconds();
    minutes = getMinutes();
    hours = getHours();
    document.getElementById("demo").innerHTML =
    hours +":"+ minutes +":"+ seconds; 
}

Is there anyway I could allow it to update automatically every second? Thanks.

use setInterval https://developer.mozilla.org/en-US/docs/Web/API/WindowTimers/setInterval — taylorc93, May 08 '15 at 15:24
Possible duplicate of http://stackoverflow.com/questions/9247977/clock-in-javascript — Patrick Roberts, May 08 '15 at 15:25

score 0 · Answer 1 · edited May 23 '17 at 12:31

0

Try running the function every second using the setInterval() method. See this topic Run JavaScript function at regular time interval -not sure it is the best approach but it might work...

edited May 23 '17 at 12:31

Community

1
1

answered May 08 '15 at 15:27

samzmann

2,286
3
20
47

score 0 · Accepted Answer · answered May 08 '15 at 15:31

You need setInterval and a proper date object, but you do not want to execute that in a body tag.

<!DOCTYPE html>
<html>
  <head>
    <title>Clock</title>
    <script>
      window.onload=function() {
        setInterval(showTime,500); // run every 500ms
      }
      function pad(num) {
        return ("0"+num).slice(-2); // pad the number with leading 0
      } 
      function showTime() {
        var d    = new Date(), // now
         seconds = d.getSeconds();
         minutes = d.getMinutes();
         hours   = d.getHours();
         document.getElementById("demo").innerHTML = pad(hours) +":"+ pad(minutes) +":"+ pad(seconds); 
      } 
      </script>    
    </head>
    <body>
      <p id="demo"></p>
   </body>
</html>

What line of code would allow me to update a function every second?

2 Answers2