JavaScript案例：倒计时
展示效果：
代码示例：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>倒计时</title>
<style>
a{
/*去除下划线*/
text-decoration: none;
color: black;
font-size: 20px;
}
span{
color: skyblue;
font-size: 25px;
}
</style>
</head>
<body>
<div>
<a href="#">现在是北京时间：</a>
<span>2022</span>
<a href="#">年</a>
<span>5</span>
<a href="#">月</a>
<span>5</span>
<a href="#">日</a>
<span>19</span>
<a href="#">:</a>
<span>50</span>
<a href="#">:</a>
<span>54</span>
</div>
<div>
<a href="#">敌军还有</a>
<span>5</span>
<a href="#">秒到达战场······</a>
</div>
<script>
var box = document.getElementsByTagName("div");
var spa = document.getElementsByTagName("span");
// 日期
setInterval(function () {
var data = new Date();
// 获取年
var year = data.getFullYear();
// 获取月
var mouth = data.getMonth()+1;
// 获取日
var day = data.getDate();
// 获取时
var hour = data.getHours();
// 获取分
var mini = data.getMinutes();
// 获取秒
var sec = data.getSeconds();
// 补齐两位数
if (mini<10){
mini = "0" + mini;
}
if (sec<10){
sec = "0" + sec;
}
// 获取到的年赋值给第一个span标签
spa[0].innerText = year;
spa[1].innerText = mouth;
spa[2].innerText = day;
spa[3].innerText = hour;
spa[4].innerText = mini;
spa[5].innerText = sec;
},1000)
var timer = 6;
setInterval(function () {
if (timer<=0){
box[1].innerText = "时间已到，全军出击！！！";
box[1].style.color = "red";
box[1].style.fontSize = "20px";
}else {
timer--;
spa[6].innerText = timer;
}
},1000)
</script>
</body>
</html>
