html时间倒计时

最新推荐文章于 2024-04-04 05:17:03 发布

QH_染

最新推荐文章于 2024-04-04 05:17:03 发布

阅读量557

点赞数 1

文章标签： javascript html

本文链接：https://blog.csdn.net/QHCXY/article/details/118085751

版权

文章目录

一、HTML+js[时间倒计时]
- 输出结果

一、HTML+js[时间倒计时]

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title> 时间倒计时</title>
	</head>
	<body>
		<!-- 显示剩余时间 -->
		<div id="date" style="margin:0 auto;"></div>
	</body>
	<script type="text/javascript">
		function Date_count_down(jztime, divname) {
			var now = new Date();
			var endDate = new Date(Date.parse(jztime.replace(/-/g, "/")));
			var leftTime = endDate.getTime() - now.getTime();
			var leftsecond = parseInt(leftTime / 1000);
			var day = Math.floor(leftsecond / (60 * 60 * 24));//天数
			var hour = Math.floor((leftsecond - day * 24 * 60 * 60) / 3600);//小时
			var minute = Math.floor((leftsecond - day * 24 * 60 * 60 - hour * 3600) / 60);//秒
			var date_d = document.getElementById(divname);
			date_d.innerHTML = "距离2021-6-30还剩余" + day + "天" + hour + "时" + minute +"分";
		}
		var engTime = "2021-6-30"; //截止时间
		window.setInterval(function() {
			Date_count_down(engTime, 'date');
		}, 1000);
	</script>
</html>

输出结果

在这里插入图片描述

QH_染

关注

1
点赞
踩
3

收藏

觉得还不错? 一键收藏
打赏
0
评论
html时间倒计时

文章目录一、HTML+js[时间倒计时]输出结果一、HTML+js[时间倒计时]<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title> 时间倒计时</title> </head> <body>  <div id="date" style="margin:0 auto;"&g
复制链接

扫一扫