1.计时器:
描述:window中提供了两种计时器,即延迟期和定时器
语法:
1) 定时器:
创建定时器:var timer = setInterval(function () {...},ms);
删除定时器:clearlnterval ( timer );
2) 延迟期:
创建延迟器:var timer = setTimeout(function(){...},ms);
删除延迟器:clearTimeout( timer );
本质:定时器的本质实际上是【系统时钟插槽的序号】,我们无法直接操作定时器本身
特征:计时器的计时操作都是发生在【代码执行完毕之后】
2.JavaScript计时器实现倒计时效果:
//1.1 创建一个空字符串:用于结束存放倒计时var $str = "";//1.2 创建结束时间var $end$date = `-1-18 20:00:00`;//1.3 创建一个倒计时函数_djs_fn = (_str,_end_date)=>{//1.3.1 获取结束时间var _end_time = new Date(_end_date);//1.3.2 获取当前时间var _datetime = new Date();//1.3.3 计算倒计总秒数var _total_s = parseInt((_end_time-_datetime)/1000);//1.3.4 计算倒计天数var _day = Math.floor(_total_s/(60*60*24));//1.3.5 取余(算倒计时小时数)var _modulo = _total_s % (60*60*24);//1.3.6 计算倒计小时var _hs = Math.floor(_modulo/(60*60));//1.3.7 取余(算倒计时分钟数)_modulo = _modulo %(60*60);//1.3.8 计算倒计分钟var _min =Math.floor(_modulo / 60);//1.3.9 计算倒计秒数var _s = _modulo % 60;//1.3.10 将计算出的倒计时传给空字符_str = `距离${_end_date}还有:${_day}天${_hs}小时${_min}分钟${_s}秒`;document.body.innerHTML =_str;//1.3.11 创建延迟器var timer = setTimeout(() => {//1.3.12 函数自身调用自身_djs_fn(_str,_end_date);}, 1000);//1.3.13 判断倒计时总秒数if (_total_s == 0) {//1.3.14 倒计时总秒数为0就删除延迟器clearTimeout(timer);}}//1.3.15 调用倒计时函数_djs_fn($str,$end$date);
效果图: