js定时器与定时器案例

最新推荐文章于 2022-07-08 19:10:50 发布

Survivor_lll

最新推荐文章于 2022-07-08 19:10:50 发布

阅读量715

点赞数

文章标签：定时器案例

本文链接：https://blog.csdn.net/a_lllll/article/details/85043665

版权

本文详细探讨了JavaScript中的定时器，包括setInterval和setTimeout的使用方法及语法结构。通过实例展示了如何获取当前时间、实现验证码倒计时、打字机效果以及简单抽奖活动等应用场景。此外，还讨论了定时器的开始、停止和无缝滚动功能，以及如何设定截止时间。

摘要由CSDN通过智能技术生成

JavaScript 的定时器

setInterval( )

循环定时器：固定时间间隔指定一次，像闹钟一样，不关闭继续执行。

按照指定的周期（毫秒），来调用函数或计算表达式，方法会不停的调用函数

clearInterval（）：清除计时器

语法结构：

setInterval（调用函数名称，执行的时间），以毫秒为单位

setTimeout( )

炸弹定时器：只执行一次，不能执行下一次了

在指定的毫秒数后调用函数或计算表达式，清除计时器使用 clearTimeout（）

定时器用法案例

<script type="text/javascript">
		/*JS中的定时器分为两种:
			(1)循环定时器:setInterval():循环执行(调用函数)
			(2)炸弹定时器:setTimeout(): 只执行一次*/
		//有函数名的
			var time=setInterval(show,3000);
			function show(){
    
				alert('我一定会回来的');
			}
		//匿名函数
			var time_01=setTimeout(function(){
    
				alert('我只执行了一次！');
			},2000)
</script>

计时器案例

获取当前时间

使用setInterval（）

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>使用setInterval()</title>
		<script type="text/javascript">
			var timer=setInterval('myTime()',1);
			function myTime(){
    
				var times=new Date();
				var h=times.getHours();
				var m=times.getMinutes();
				var s=times.getSeconds();
				m=zero(m);
				s=zero(s);
				var ms=times.getMilliseconds();
				document.getElementsByTagName('body')[0].innerHTML='当前时间为：'+h+'时'+m+'分'+s+'秒'+ms+'毫秒';
				function zero(i){
    
					if (i<10) {
    
						i='0'+i;
					}
					return i;
				}
			}
		</script>
	</head>
	<body>
	</body>
</html>

在这里插入图片描述

使用setTimeout（）

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>使用setTimeout（）</title>
		<script type="text/javascript">
			function myTime(){
    
				var div1=document.getElementById('div1');
				var times=new Date();
				var h=times.getHours();
				var m=times.getMinutes();
				var s=times.getSeconds();
				m=zero(m);
				s=zero(s);
				var ms=times.getMilliseconds();
				div1.innerHTML='当前时间为：'+h+'：'+m+'：'+s+'：'+ms
				setTimeout('myTime()',1);
				function zero(i){
    
					if (i<10) {
    
						i='0'+i;
					}
					return i;
				}
			}
		</script>

最低0.47元/天解锁文章

Survivor_lll

关注

0
点赞
踩
13

收藏

觉得还不错? 一键收藏
0
评论
js定时器与定时器案例

JavaScript 的定时器setInterval( )循环定时器：固定时间间隔指定一次，像闹钟一样，不关闭继续执行。按照指定的周期（毫秒），来调用函数或计算表达式，方法会不停的调用函数clearInterval（）：清除计时器语法结构：setInterval（调用函数名称，执行的时间），以毫秒为单位setTimeout( )炸弹定时器：只执行一次，不能执行下一次了在指定...
复制链接

扫一扫