<!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>
