<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> #div1{ width: 200px; height: 50px; line-height: 50px; background-color: #000; color: #0f0; border-radius: 20px; text-align: center; font-size: 30px; } </style> </head> <body> <div id='div1'></div> <button id="end">停止</button> <button id="start">开始</button> </body> <script type="text/javascript"> function getDate(){ obj=new Date(); hours=obj.getHours(); minutes=obj.getMinutes(); seconds=obj.getSeconds(); if(hours<10){ hours='0'+hours; } if(minutes<10){ minutes='0'+minutes; } if(seconds<10){ seconds='0'+seconds; } str=hours+':'+minutes+':'+seconds; sobj=document.getElementById('div1'); sobj.innerHTML=str; } function starts(){ times=setInterval(getDate,1000); } function ends(){ clearInterval(times); } getDate(); starts(); // 关闭秒表 end=document.getElementById('end'); end.onclick=function(){ ends(); } //开始秒表 start=document.getElementById('start'); start.onclick=function(){ starts(); } </script> </html>