HTML中详述setInterval()方法与setTimeout()方法区别

setInterval()

用法:setInterval(“方法名”,时间);
作用:每隔一段时间执行一次方法。
代码示例:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		
		<input type="button" value="查询" onclick="jump()" />
		<input type="button" value="停止" onclick="c()" />
		<input type="button" value="开始" onclick="s()" />
		
		<!--window-->
		<script>
			
			function t(){
				console.log(857);
			}
			var id = setInterval("t()",1000);
			
			function s(){
				id = setInterval("t()",1000);
			}

			//停止setInterval
			function c(){
				clearInterval(id);
			}
			
		</script>
		
		
	</body>
</html>
 

结果展示:

点击结束按钮,停止执行方法,次数确定为4次;点击开始按钮,从4开始继续每秒执行一次方法。

setTimeout()

用法:setTimeout(“方法名”,时间);
作用:在一段时间后,执行一次方法结束,即只执行一次方法。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		
		<input type="button" value="查询" onclick="jump()" />
		<input type="button" value="停止" onclick="c()" />
		<input type="button" value="开始" onclick="s()" />
		
		<!--window-->
		<script>
			
			function t(){
				console.log(857);
			}
			
			//运算倒计时
			function s(){
				var id = setTimeout("t()",1000);
			}

			//停止setTimeout
			function c(){
				clearTimeout(id);
			}
			
			

		</script>
		
		
	</body>
</html>

结果展示:

猜你喜欢

转载自blog.csdn.net/m0_46383618/article/details/107427112
今日推荐