如何使用时钟重复JavaScript函数

Question

I am just starting to learn javascirpt and I'm trying to make my own clock widget. It seems when I use the "ourDate.toLocalString()" it only displays the time as it was when the function was called. So I figured I would have to repeat the function continuously for each second in order for it to continuously keep the current time. But the problem I have is when I start the script, it repeats the function only one time. What am I doing wrong? Below is the code:

function updateclock(){
ourDate = new Date();
document.write(ourDate.toLocaleString());
}

function startclock() {
updateclock();
setInterval("updateclock()", 1000); 
}

Answer 1

The problem is document.write . If you call that after the document has loaded, it will overwrite the whole document , including your startclock function, that cannot be called anymore.

Update the content of an HTML element instead:

<div id="clock"></div>
<script type="text/javascript">
function updateclock(){
    ourDate = new Date();
    document.getElementById("clock").innerHTML = ourDate.toLocaleString();
}

function startclock() {
    updateclock();
    setInterval(updateclock, 1000); 
}
startclock();
</script>

http://jsfiddle.net/Ys87F/

Also: do not pass a string to setInterval (or setTimeout ), pass the function name instead.

Answer 2

您要改为执行此操作：

setInterval(updateclock, 1000);