JavaScript 定时器-优快云博客

本文链接：https://blog.youkuaiyun.com/houyanhua1/article/details/78477967

定时器：
反复性定时器：格式：window.setInterval("fn()",1000); //会反复执行。每一秒执行一次fn()函数。
一次性定时器：格式：window.setTimeout("fn()",5000); //执行一次。5秒之后会自动执行fn()函数。

清除定时器：
window.clearInterval(n1); //清除反复性定时器n1
window.clearTimeout(n1); //清除一次性定时器n1

继续定时器：
var n1=window.setInterval("fn()",1000); //定义定时器。将定时器存放到n1变量中，用于清除继续定时器。

n1=window.setInterval("fn()",1000); //继续定时器n1。注意前面没有var，表示和上面的定时器是同一个定时器。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh-cn">
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
	<title>定时器</title>
	<meta name="keywords" content="关键字列表" />
	<meta name="description" content="网页描述" />
	<link rel="stylesheet" type="text/css" href="" />
	<style type="text/css">
		#div{
			font-size:60px;
			margin:0 auto;
			width:900px;
			border:1px solid red;
			text-align:center
		}
	</style>
	<script type="text/javascript">
		//启动定时器
		var n1=window.setInterval("fn()",5000);
		//显示时间函数
		function fn(){
			var d1=new Date();
			var obj=document.getElementById("div");
			obj.innerHTML=d1.toLocaleString();
		}
		//清除定时器
		function qingchu(){
			window.clearInterval(n1);
		}
		//继续定时器
		function jixu(){
			n1=window.setInterval("fn()",1000);  //继续定时器，前面没有var表示和上面的n1定时器是同一个定时器。
		}
		//自动停止定时器
		window.setTimeout("qingchu()",60000);
	</script>
</head>
<body>
<div id="div">时间</div>
<input type="button" value="清除定时器" οnclick="qingchu()">
<input type="button" value="继续定时器" οnclick="jixu()">
</body>
</html>