#act{
width: 500px;
height: 100px;
color: darkorange;
line-height: 100px;
margin: 50px auto;
text-align: center;
font-size: 20px;
}
<!-- 活动倒计时 -->
<!-- <div id="act">距离表演还有03天06小时59分40秒</div> -->
活动倒计时 两个时间,活动开始时间和结束时间 ,相减找出时间戳(单位为毫秒),将其转化为距离的天,小时,分,秒
再将其赋值给div,
注意点,时间是一个动态变化,用定时器,里面传入函数(怎么变)和变化时间,赋值给div时是在定时器内
//美化下格式,可以封装一个函数,加些东西
var act=document.getElementById("act")
var endtime=new Date("2019/6/30 00:00:00")
console.log(endtime);
setInterval(function(){
var nowtime=new Date()
//总共需要的秒数
var seconds=parseInt((endtime-nowtime)/1000)
//需要的天数
var day=fn(parseInt(seconds/3600/24)) //在内部使用var 声明变量,是一个局部变量,作用于内部
//需要的小时
var hou=fn(parseInt(seconds/3600%24))
//需要多少分
var sec=fn(parseInt(seconds/60%60))
//需要的毫秒
var mil=fn(parseInt(seconds%60))
act.innerHTML="距离表演还有"+day+"天"+hou+"小时"+sec+"分"+mil+ "秒"
},1000)
function fn(num){ //老子封装的函数,函数就是方法
if(num<10){
return "0"+num
}else{
return num
}
}
js制作活动倒计时(定时器)
最新推荐文章于 2022-11-10 09:18:44 发布