项目实战jquery倒计时_jquery倒计时项目-CSDN博客

本文链接：https://blog.csdn.net/LG20091570/article/details/53611297

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>简单易用的倒计时js代码</title>
<script src="http://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js"></script>

<style>
*{ margin:0; padding:0; list-style:none;}
body{ font-size:18px; text-align:center;}
.time{ height:30px; padding:100px;}
</style>
</head>
<body>
<div class="time" data-time="2018/09/20 00:00:00"></div>
<div class="time" data-time="2019/11/15 06:32:16"></div>
<script>
$('.time').each(function(){
var setTime = $(this).attr('data-time')
var _this = $(this)
_this.append("<span class='t_d'>00天</span>"+"<span class='t_h'>00时</span>"+"<span class='t_m'>00分</span>"+"<span class='t_s'>00秒</span>")
function GetRTime(){
var EndTime= new Date(setTime);
var NowTime = new Date();
var t =EndTime.getTime() - NowTime.getTime();
var d=0;
var h=0;
var m=0;
var s=0;
if(t>=0){
d=Math.floor(t/1000/60/60/24);
h=Math.floor(t/1000/60/60%24);
m=Math.floor(t/1000/60%60);
s=Math.floor(t/1000%60);
}else{
_this.html( "活动已经结束");
}
_this.find(".t_d").html(d + "天");
_this.find(".t_h").html(h + "时");
_this.find(".t_m").html(m + "分");
_this.find(".t_s").html(s + "秒");
}
setInterval(GetRTime,0);
_this.removeAttr('data-time')
})
</script>

</body>
</html>