前端 —— JavaScript 基础篇 21 --- 倒计时 demo

最新推荐文章于 2022-01-11 15:40:46 发布

淡泊-宁静致远

最新推荐文章于 2022-01-11 15:40:46 发布

阅读量209

点赞数

分类专栏： JavaScript 文章标签： javascript 前端

本文链接：https://blog.csdn.net/dingdinglaila/article/details/106942404

版权

本文介绍了使用JavaScript创建倒计时的经典示例，通过解析时间戳实现从目标时间到当前时间的毫秒差，进而转换为天、小时、分钟和秒。文章提供了详细的计算逻辑，并分享了一个倒计时插件的链接，适合前端开发者学习参考。

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

前面提到了计时器。今天上个倒计时的例子，很经典的一个小 demo。直接上代码了。反正是为了方便自己日后复制粘贴。若是能帮到大家，那最好不过，拿走不谢！

html 部分：

<style type="text/css">
	div{
		margin:20px auto;
		text-align: center;
	}
</style>

<div>
	<span>现在的时间时：</span><span class="nowtime"></span>
</div>
<div>
	<span>距离 2020年10月01日还有：</span>
	<span class="comingtime"></span>
</div>

js 部分：

var eleNowTime = document.querySelector('.nowtime'),
    eleComingTime = document.querySelector('.comingtime');

function getTimes() {
	var nowTime = new Date();
	var arr = ['星期日','星期一','星期二','星期三','星期四','星期五','星期六'];
	var year = nowTime.getFullYear(),
		month = nowTime.getMonth() + 1,
		day