定时器

最新推荐文章于 2025-07-05 16:11:01 发布

原创最新推荐文章于 2025-07-05 16:11:01 发布 · 255 阅读

0 ·

CC 4.0 BY-SA版权

JavaScript 专栏收录该内容

44 篇文章

订阅专栏

博客主要介绍了JavaScript中setInterval和setTimeout函数。setInterval会每隔指定时间无限制循环执行代码，其返回唯一数字表示定时器，可清除；该函数并不准确。setTimeout则是推迟代码运行，在指定毫秒数后只运行一次，也有清除方法，还提及做三分钟定时器。

setInterval(function () {

},time)

每隔time的时间，无限制的循环function内的代码

time无法更改，他还是1000；

那我们现在来看看setInterval是否准

所以，setInterval是不准的

现在来看一下setInterval的返回值

每一个定时器都会返回一个数字，作为他的唯一表示

所以我们也就有了清楚定时器的方法

--------------------------------------------------------------------

   setTimeout(function () {
       console.log('123');
   }, 1000);

推迟代码运行，在相应的毫秒数之后，再运行，且只运行一次

clearTimeout(); 清楚setTimeout

做一个三分钟的定时器

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>VVVGG</title>
	<link rel="stylesheet" type="text/css" href="lesson1.css">
	<script src="jquery-3.3.1.min.js" type="text/javascript" charset="utf-8"></script>
	<style type="text/css">
		*{
			padding: 0;
			margin: 0;
		}
		input{
			border: 1px solid black;
			text-align: right;
			font-size: 20px;
			font-weight: bold;
		}
	</style>
</head>
<body>
	minutes:<input type="text" name="" value="0">
	seconds:<input type="text" name="" value="0">
</body>
<script type="text/javascript" charset="utf-8">
	var input = document.getElementsByTagName('input');
	var minutes = 0;
	var seconds = 0;
	var timer = setInterval(function () {
		minutes = parseInt(input[0].value);
		seconds = parseInt(input[1].value);
		seconds += 1;
		if(seconds == 60) {
			seconds = 0;
		   minutes += 1;
		}
		input[0].value = minutes;
		input[1].value = seconds;
		if(minutes == 3) {
			clearInterval(timer);
		}
	}, 200)
</script>
</html>