<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
#time {
color: darkseagreen;
text-align: center;
padding-top: 10px;
font-size: 40px;
}
</style>
</head>
<body>
<div id="time">
</div>
<script>
window.onload = function () {
//1、获取需要的标签
var time = document.getElementById('time');
//2、定义时间,获取到时间戳
//将来的时间
var newYearTime = new Date('2021/02/11 00:00:00');
//3、开启定时器
var timer = setInterval(function () {
//现在的时间
var nowTime = new Date();
//4、获取时间戳
var newYearDate = newYearTime.getTime();
var nowDate = nowTime.getTime();
//判断是否到期
if (newYearDate - nowDate <= 0) {
//替换文字
time.innerText = '新年快乐~~~!!!!';
//到期清理定时器
clearInterval(timer);
} else {
//5、剩下的时间戳
var aNextData = newYearDate - nowDate;
//6、转换相关单位
var newYearS = parseInt(aNextData / 1000); //毫秒转秒
var newYearD = parseInt(newYearS / 3600 / 24); //天
var newYearH = parseInt(newYearS / 3600 % 24); //小时
var newYearM = parseInt(newYearS / 60 % 60); //分钟
var newYearSS = newYearS % 60; //秒杀
//拼接数据
var showData = '距离2021年春节还有' + newYearD + '天' + newYearH + '小时' + newYearM + '分钟' + newYearSS + '秒';
//替换数据
time.innerText = showData;
}
}, 1000);
}
</script>
</body>
</html>
最后修改:2020 年 08 月 12 日
© 允许规范转载