JavaScript中的计时器SetInterval和Settimeout讲解

1.SetInterval
定义: ;循环定时器:固定时间间隔指定一次,像闹钟 一样,不关闭继续执行。
语法结构:setInterval(code,millisec,lang)
参数code: 必需。要调用的函数或要执行的代码串。
参数millisec:必须。周期性执行或调用 code 之间的时间 间隔,以毫秒计。
参数lang:可选。 JScript | VBScript | JavaScript

案列:获取系统当前时间

		<script>
			//setInterval(code,millisec,lang)   参数code 要调用的函数或执行的代码      millisec周期执行的时间间隔,毫秒计算
		
			//循环计时器,每隔一秒就输出一次hellow
			/*setInterval(function(){
				alert('hellow')
			},1000);*/ 
			var mysetInterval;
			//开始计时器
			function startInterval(){
				mysetInterval=setInterval('myFunction()',1000);
			}
			
			//获取当前时间的函数
			function myFunction(){
				var datetime=new Date();
				hours=datetime.getHours();
				minutes=datetime.getMinutes();
				seconds=datetime.getSeconds();
				document.getElementById('h2_01').innerHTML='当前时间为:'+hours+':'+minutes+':'+seconds;
			}
			//暂停计时器
			function stopInterval(){
				clearInterval(mysetInterval);
			}
			
		</script>
	</head>
	<body>
		<h2 id="h2_01">使用setInterval()循环计时器,实现时间停止和开始</h2>
		<input type="button"  onclick="startInterval();" value="开始"/>
		<input type="button" onclick="stopInterval();" value="暂停" />
	</body>

2.Settimeout
实现一个简易的闹钟

<script>
			window.onload=function(){
				//setTimeOut 只会计时一次
				//setTimeout('alert("hellow world")',3000);
				function startTimeOut(){
					var datetime=new Date();
					hours=datetime.getHours();
					minutes=datetime.getMinutes();
					seconds=datetime.getSeconds();
					m=check(minutes);
					s=check(seconds);
					
					document.getElementById('continer').innerHTML='当前的时间:'+hours+':'+m+':'+s;
					setTimeout('startTimeOut()',1000);
				}
				function check(i){
					if(i<10){
						i='0'+i;
					}
					return i;
				}
				startTimeOut();
			}
		</script>
	</head>
	<body>
		<div id="continer"></div>
	</body>

猜你喜欢

转载自blog.csdn.net/weixin_44269204/article/details/89478789
今日推荐