©2020-2024 ioDraw All rights reserved,
Privacy Policy
<>今日分享：
<>js制作一个简单的新年倒计时
<>一个简单的js倒计时的实现
这是页面内容：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name=
"viewport" content="width=device-width, initial-scale=1.0"> <title>新年倒计时</title>
</head> <body> <!-- 现在据春节(2月11日还有多少小时多少分多少秒) --> <div class="time" style=
"color: red;text-align: center;font-size: 30px;border: 1px solid
yellow;margin-top: 300px;"> 距离春节倒计时： <span id="lefttime"></span> </div> <script
> //封装函数newtime function newtime(){ var time=new Date("2021/2/11,00:00:00")
//这是春节那天的时间 var nowtime=new Date()//获取今天现在的事件 var lefttime=parseInt((time.
getTime()-nowtime.getTime())/1000)//他们之间的时间差 d=parseInt(lefttime/(24*60*60))
//所剩day h=parseInt(lefttime/(60*60)%24)//小时 m=parseInt(lefttime/60%60)//分钟 s=
parseInt(lefttime%60)//秒 document.getElementById("lefttime").innerHTML=d+"天"+h+
"小时"+m+"分"+s+"秒";//获取值呈现在页面上 if(lefttime<=0){ document.getElementById("lefttime"
).innerHTML="新年快乐！" } }//判断是否达到如果倒计时完成则显示新年快乐 newtime(); var sh; sh=setInterval(
newtime,1000)//计时器 </script> </body> </html>
<>HTML效果：
难点：
1.时间的计算，算了好几次都没有成功
2.js定时器的用法
定时器有两种
周期性定时器：setInterval();按照指定的周期（以毫秒记）来调用函数或计算表达式。方法会不停地调用函数，直到clearInterval()被调用窗口才会关闭
他有两个必须参数
code是必须的，一般是要调用的函数
millisec 是周期时间间隔一般规定单位为毫秒
延迟性定时器：setTimeout()：在指定的毫秒数后才调用函数或计算表达式
清除定时器：clearInterval(函数名)
clearTimeout(函数名);
<>例子：
setTimeout只执行一次function(){}
setInterval会每隔interval时间执行一次，直至定时器关闭
//创建定时器方法 var time1 = window.setTimeout(function(){},interval); var time2 =
window.setInterval(function(){},interval); //清除定时器方法 window.clearTimeout(time1);
window.clearTimeout(time2);
<>总结：今天的分享就到这里了，主要是定时器的使用。