<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div id="timeNow"></div>
<input type="button" value="开始时间" οnclick="openTime()"/>
<input type="button" value="结束时间" οnclick="stopTime()"/>
</body>
</html>
<script>
function stime() {
var time = new Date();
var h = time.getHours();
var m = time.getMinutes();
var s = time.getSeconds();
document.getElementById("timeNow").innerText = h + ":" + m + ":" + s;
//setTimeout("stime()", 1000); //用setTimeout()达到动态显示时间的效果,需要在stime()函数里再调用一次stime()函数
}
//showTime();
setInterval("stime()",1000);//setlnterval()本来就是每隔一段时间就执行一次,比较简单
var time=null;
//开始时间
function openTime(){
//setTimeout("showTime()",1000);
//time=setInterval("stime()",1000);
time=setTimeout("stime()",1000);//实现的思路是:调用stime函数里面又开了一个定时器,达到不断循环的作用
}
//关闭时间
function stopTime(){
//clearInterval(time);
clearTimeout("stime()",1000);
}
</script>