课堂笔记——倒计时

最新推荐文章于 2024-07-25 15:46:04 发布

AI_____

最新推荐文章于 2024-07-25 15:46:04 发布

阅读量64

点赞数

文章标签： javascript 前端 servlet html

本文链接：https://blog.csdn.net/AI_____/article/details/127322291

版权

代码

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style>
	Div,h3{font-size: 36px;}
	input{width: 30px;height: 40px;background:#000;
		color:#fff;text-align: center;font-size: 36px;
	}
	</style>
</head>

<body>
<div>
	<h3>---距离2023年还有---</h3>
	<input type="text" value="0"/><input type="text" value="0"/>天
	<input type="text" value="0"/><input type="text" value="0"/>小时
	<input type="text" value="0"/><input type="text" value="0"/>分
	<input type="text" value="0"/><input type="text" value="0"/>秒
</div>
<script>
	window.onload=function(){
		setInterval(show,1000);
		function show(){
			var aIinput=document.getElementsByTagName("input");
			var today=new Date();
			var Endtime=new Date("2023/01/01,00:00:00");
			var now=today.getTime();
			var end=Endtime.getTime();
			var t=Endtime.getTime()-today.getTime();
			var seconds=Math.floor(t/1000);
			var day=Math.floor(seconds/60/60/24);
			var h=Math.floor(seconds/60/60%24);
			var m=Math.floor(seconds/60%60);
			var s=seconds%60;
			aIinput[0].value=Math.floor(day/10);
			aIinput[1].value=day%10;
			aIinput[2].value=Math.floor(h/10);
			aIinput[3].value=h%10;
			aIinput[4].value=Math.floor(m/10);
			aIinput[5].value=m%10;
			aIinput[6].value=Math.floor(s/10);
			aIinput[7].value=s%10;
		}
	};
	</script>
</body>
</html>

效果图