先看一下实现效果:
逻辑和代码都很简单,直接上代码了
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <!--页面加载后通过onload属性调用定义好的time()方法--> <body onload="time()"> <div id="di"></div> <script> function time() { // 获取Date对象 var data = new Date(); // 通过data对象获得时、分、秒 var hour = data.getHours(); var minue = data.getMinutes(); var sec = data.getSeconds(); // 对分钟和秒进行判断重新复制 minue = check(minue); sec = check(sec); document.getElementById("di").innerHTML = hour+":"+minue+":"+sec; // 设置定时器调用time()方法,每间隔1秒调用一次 t = setTimeout(function(){ time(); },1000); } // 定义一个函数,判断分和秒是否是小于10,如果是小于是在前面加上0 function check(i) { if(i<10){ i = "0" + i; } return i; } </script> </body> </html>