js倒计时简单实现代码
倒计时:
1.设置一个有效的结束日期
2.计算剩余时间
3.将时间转换成可用的格式
4.输出时钟数据作为一个可重用的对象
5.在页面上显示时钟,并在它到达0时停止
html
<divid="clock"> <spanid="days"></span>天 <spanid="hours"></span>时 <spanid="minutes"></span>分 <spanid="seconds"></span>秒 </div>
js代码
<script><br>/*计算剩余时间*/
functiongetTimeReamin(endtime){
//剩余的秒数
varremainSec=(Date.parse(endtime)-Date.parse(newDate()))/1000;
vardays=Math.floor(remainSec/(3600*24));
varhours=Math.floor(remainSec/3600%24);
varminutes=Math.floor(remainSec/60%60);
varseconds=Math.floor(remainSec%60);
return{"remainSec":remainSec,
"days":days,
"hours":hours,
"minutes":minutes,
"seconds":seconds
}
}
varendtime="2016/10/10";
varclock=document.getElementById("clock");
//设置定时器
vartimeid=setInterval(function(){
vart=getTimeReamin(endtime);
//判断时间格式
days=t.days>=0&&t.days<10?"0"+t.days:t.days;
hours=t.hours>=0&&t.hours<10?"0"+t.hours:t.hours;
minutes=t.minutes>=0&&t.minutes<10?"0"+t.minutes:t.minutes;
seconds=t.seconds>=0&&t.seconds<10?"0"+t.seconds:t.seconds;
//设置时间
document.getElementById("days").innerText=days;
document.getElementById("hours").innerText=hours;
document.getElementById("minutes").innerText=minutes;
document.getElementById("seconds").innerText=seconds;
//清除定时器
if(t.remainSec<=0){
clearInterval(timeid);
}
});
<script>
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持毛票票。
热门推荐
10 八一幼儿祝福语大全简短
11 公司乔迁食堂祝福语简短
12 婚礼结束聚餐祝福语简短
13 儿媳买车妈妈祝福语简短
14 毕业送礼老师祝福语简短
15 同事辞职正常祝福语简短
16 恭贺新婚文案祝福语简短
17 金店立秋祝福语简短英文
18 婆婆高寿祝福语大全简短