JavaScript代码可以在界面上实现计数器获取计时器，计数器和计时器的本质是数字的累加，而显示当前的本质是获取具体时间后的字符串操作。
以上可以通过两种方式实现，一种是通过setTimeout调用函数，一种为setInterval调用函数。
<!-- 使用setTimeout实现时钟 --> <script type="text/javascript"> function getTime() { var date = new Date(); var year = date.getFullYear(); // var year = date.getYear() + 1900; 获取的是年数差 var month = date.getMonth() + 1; var day = date.getDate(); var hour = date.getHours(); var min = date.getMinutes(); var sec = date.getSeconds(); var time = year + "-" + month + "-" + (day<10 ? "0"+day:day ) + " " + hour + ":" + (min<10 ? "0"+min:min ) + ":" + sec; // console.log(year,month,day,hour,min,sec); document.getElementById("time").innerText = time; var timeOut = window.setTimeout(getTime,100); } </script> </head> <body onload="getTime();"> <div id="time"></div> </body> <!-- 使用setTimeout实现时钟 --> <script type="text/javascript"> function getTime() { var date = new Date(); var year = date.getFullYear(); // var year = date.getYear() + 1900; 获取的是年数差 var month = date.getMonth() + 1; var day = date.getDate(); var hour = date.getHours(); var min = date.getMinutes(); var sec = date.getSeconds(); var time = year + "-" + month + "-" + (day<10 ? "0"+day:day ) + " " + hour + ":" + (min<10 ? "0"+min:min ) + ":" + sec; // console.log(year,month,day,hour,min,sec); document.getElementById("time").innerText = time; } </script> </head> <body onload="setInterval(getTime,1000);"> <div id="time"></div> </body> 从以上两段代码对比可以看出，setTimeout仅仅执行一次，而setInterval可以在没有终止条件的情况下无限执行。