javascript里的定时器有哪些-前端问答-PHP中文网

javascript里的定时器有哪些

青灯夜游

发布： 2021-11-26 18:04:22

原创

5100人浏览过

javascript里的定时器有两种：1、单次定时器，使用setTimeout()方法定义，可以在规定时间（以毫秒计）过后执行一次代码块；2、循环定时器，使用setInterval()方法定义，按照指定的周期（以毫秒计）来重复执行某些代码。

javascript里的定时器有哪些

本教程操作环境：windows7系统、javascript1.8.5版、Dell G3电脑。

在 JavaScript 中，我们可以利用定时器来延迟执行某些代码，或者以固定的时间间隔重复执行某些代码。例如，您可以使用定时器定时更新页面中的广告或者显示一个实时的时钟等。

JavaScript 中提供了两种定时器：setTimeout() 和 setInterval()

方法	说明
setTimeout()	在指定的时间后（单位为毫秒），执行某些代码，代码只会执行一次
setInterval()	按照指定的周期（单位为毫秒）来重复执行某些代码，定时器不会自动停止，除非调用 clearInterval() 函数来手动停止或着关闭浏览器窗口

setTimeout()

立即学习“Java免费学习笔记（深入）”；

JS setTimeout() 函数用来在指定时间后执行某些代码，代码仅执行一次。

使用方法：

setTimeout(code,millisec)

登录后复制

code 必需。要调用的函数后要执行的 JavaScript 代码串。
millisec 必需。在执行代码前需等待的毫秒数。

阿里翻译
阿里巴巴提供的多语种在线实时翻译网站，支持文档、图片、视频、语音等多模态翻译

170

查看详情

实例：

<html>
	<head>
		<meta charset="utf-8" />
	</head>
	<body>
		<button id="button" onclick="click1()">获取验证码</button>
		<span id="span"></span>
		<script>
			var time = 10;
			var num;
			var button = document.getElementById("button");
			var span = document.getElementById("span");
 
			function click1() {
				//click是关键字,所有函数名改为click1
				if (time == 0) {
					button.disabled = false;
					time = 10;
					span.innerHTML = "";
					clearTimeout(num);
				} else {
					button.disabled=true;
					span.innerHTML = time + "秒后重新获得返回值";
					time--;
					num = setTimeout("click1()",1000);
				}
			}
		</script>
	</body>
</html>

登录后复制

setInterval()

JS setInterval() 函数可以定义一个能够重复执行的定时器，每次执行需要等待指定的时间间隔。

使用方法：

setInterval(code,millisec[,"lang"])

登录后复制

code 必需。要调用的函数或要执行的代码串。
millisec 必须。周期性执行或调用 code 之间的时间间隔，以毫秒计。

实例：

<html>
	<head>
		<meta charset="utf-8" />
	</head>
	<body>
		<button id="button" onclick="set()">获取验证码</button>
		<span id="span"></span>
		<script>
			var time = 10;
			var num;
			var button = document.getElementById("button");
			var span = document.getElementById("span");
 
			function set() {
				num = setInterval("click()", 1000);
				button.disabled = true;
			}
 
			function click() {
				if (time == 0) {
					button.disabled = false;
					time = 10;
					span.innerHTML = "";
					clearInterval(num);
				} else {
					span.innerHTML = time + "秒后重新获得返回值"
					time--;
				}
			}
		</script>
	</body>
</html>

登录后复制

【推荐学习：javascript高级教程】

以上就是javascript里的定时器有哪些的详细内容，更多请关注php中文网其它相关文章！