html中代码
<!DOCTYPE html
>
<
html
lang=
"en"
>
<
head
>
<
meta
charset=
"UTF-8"
>
<
meta
name=
"viewport"
content=
"width=device-width, initial-scale=1.0"
>
<
meta
http-equiv=
"X-UA-Compatible"
content=
"ie=edge"
>
<
title
>Document
</
title
>
</
head
>
<
body
>
<
div
class=
"count-time"
>
<
span
class=
"tis1"
></
span
>
<
span
class=
"tis2"
>天
</
span
>
<
span
class=
"tis3"
></
span
>
<
span
class=
"tis4"
>时
</
span
>
<
span
class=
"tis5"
></
span
>
<
span
class=
"tis6"
>分
</
span
>
<
span
class=
"tis7"
></
span
>
<
span
class=
"tis8"
>秒
</
span
>
</
div
>
<
script
src=
"lib/jquery/jquery-3.3.1.min.js"
>
<
/
script
>
<
script
src=
"js/chacha.js"
>
<
/
script
>
<
script
>
window.
setInterval(
function(){
$(
".count-time").
countDown(
'2018/07/07 24:00:00');
},
1000);
<
/
script
>
</
body
>
</
html
>
封装的js代码
;(
function(
$){
$.
fn.
extend({
countDown
:
function(
endTime){
//取设定的活动结束时间距1970年1月1日之间的毫秒数
var
end=
new
Date(
endTime).
getTime();
//取当前时间距1970年1月1日之间的毫秒数
var
nowTime=
new
Date().
getTime();
//结束时间与当前时间之间的毫秒差
var
difference=
end-
nowTime;
if (
difference>
0) {
//将毫秒差换算成天数
days=
Math.
floor(
difference/
86400000);
difference=
difference-
days*
86400000;
//换算成小时
hours=
Math.
floor(
difference/
3600000);
difference=
difference-
hours*
3600000;
//换算成分钟
minutes=
Math.
floor(
difference/
60000);
difference=
difference-
minutes*
60000;
//换算成秒数
seconds=
Math.
floor(
difference/
1000);
//不足10时，进行补零操作
if(
hours<
10){
hours=
"0"+
hours;
};
if(
minutes<
10){
minutes=
"0"+
minutes;
};
if(
seconds<
10){
seconds=
"0"+
seconds;
};
$(
".tis1").
html(
days);
$(
".tis3").
html(
hours);
$(
".tis5").
html(
minutes);
$(
".tis7").
html(
seconds);
}
else {
//设定若是过了设置的活动结束时间，全部写成0天0时0分0秒
$(
".tis1").
html(
0);
$(
".tis3").
html(
0);
$(
".tis5").
html(
0);
$(
".tis7").
html(
0);
}
}
})
})(
jQuery);
大概效果呈现
3天06时09分34秒
