实例（jQuery倒计时效果）
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script src="jq_3.3.1_mi.js"></script>
<style>
div {
width: 800px;
height: 500px;
background-color: pink;
margin: 0 auto;
}
h3 {
color:brown;
text-align: center;
line-height: 500px;
margin:0 auto;
}
</style>
</head>
<body>
<div id="time">
<h3>2019年农历春节倒记时：
<span id="_d">00</span>
<span id="_h">00</span>
<span id="_m">00</span>
<span id="_s">00</span>
</h3>
</div>
<script>
$(function() {
function Start() {
var date = new Date();
var now = date.getTime();//获取到当前时间戳
var endDate = new Date("2019-02-04 00:00:00");
var end = endDate.getTime();//获取到结束时间戳
var leftTime = end - now;
var d, h, m, s;
if(leftTime >= 0){
d = Math.floor(leftTime / 1000 / 60 / 60 / 24);//计算出倒计时的天数
h = Math.floor(leftTime / 1000 / 60 / 60 % 24);//计算出倒计时的小时数
m = Math.floor(leftTime / 1000 / 60 % 60);//计算出倒计时的分钟
s = Math.floor(leftTime / 1000 % 60);//计算出倒计时的秒数
if(s < 10) {
s = "0" + s;
}
if(m < 10) {
m = "0" + m;
}
if(h < 10) {
h = "0" + h;
}
} else {
console.log('已截止');
}
$('#_d').text(d + "天");
$('#_h').text(h + "时");
$('#_m').text(m + "分");
$('#_s').text(s + "秒");
}
setInterval(Start,1000);
})
</script>
</body>
</html>运行实例 »
点击 "运行实例" 按钮查看在线实例
