收藏
批改状态：合格
老师批语：
js的农历新年倒计时表功能的实现
第一步——编写HTML与css代码
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>倒计时</title>
<script src="jq_3.3.1_mi.js"></script>
</head>
<style>
#box{
margin:10px auto;
background: pink;
width: 600px;
height: 400px;
text-align: center;
}
p{
line-height: 400px;
color:lightyellow;
}
</style>
<body>
<div id="box">
<p></p>
</div>
</body>
</html>第二步——设置时间的终点（此案例为农历新年的日期）
var newyear = new Date(2019,1,5,0,0,0,0);
Date()函数中的参数依次为年，月，日，时，分，秒，毫秒
若不给与参数值则默认为当前的时间。
第三步——定义一个变量，它的值为所设置的时间终点与当前时间的差的毫秒数，并通过这个值得出天数，小时，秒。
var data = newyear.getTime()-myday.getTime(); var D = Math.floor(data/1000/60/60/24); var H = Math.floor(data/1000/60/60%24); var M = Math.floor(data/1000/60%60); var S = Math.floor(data/1000%60);
getTIME()函数用于获取当前时间距1970年1月1日的毫秒数。
Math.floor用于获取将数向下取整。例如13.9取13。
第四步——将这些值按照倒计时的格式传值给html中的p标签
var p = document.getElementsByTagName('p')[0];
p.innerHTML = "2019年农历春节倒计时："+D+"天"+H+"时"+M+"分"+S+"秒";第五步——设置一个定时器循环执行第三与第四步从而实现倒计时功能
var timer = setInterval(function(){
var myday = new Date();
var data = newyear.getTime()-myday.getTime();
var D = Math.floor(data/1000/60/60/24);
var H = Math.floor(data/1000/60/60%24);
var M = Math.floor(data/1000/60%60);
var S = Math.floor(data/1000%60);
var p = document.getElementsByTagName('p')[0];
p.innerHTML = "2019年农历春节倒计时："+D+"天"+H+"时"+M+"分"+S+"秒";
},1000);setInterval（）设置定时器的函数。
全部代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>倒计时</title>
<script src="jq_3.3.1_mi.js"></script>
</head>
<style>
#box{
margin:10px auto;
background: pink;
width: 600px;
height: 400px;
text-align: center;
}
p{
line-height: 400px;
color:lightyellow;
}
</style>
<body>
<div id="box">
<p></p>
</div>
</body>
</html>
<script>
var newyear = new Date(2019,1,5,0,0,0,0);
var timer = setInterval(function(){
var myday = new Date();
var data = newyear.getTime()-myday.getTime();
var D = Math.floor(data/1000/60/60/24);
var H = Math.floor(data/1000/60/60%24);
var M = Math.floor(data/1000/60%60);
var S = Math.floor(data/1000%60);
var p = document.getElementsByTagName('p')[0];
p.innerHTML = "2019年农历春节倒计时："+D+"天"+H+"时"+M+"分"+S+"秒";
},1000);
</script>点击 "运行实例" 按钮查看在线实例
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
