js实现精确到秒的倒计时效果

本文实例为大家分享了两种倒计时效果，供大家参考，具体内容如下

效果图：

1.倒计时效果

！DOCTYPE html html head meta charset=' utf-8 '/title倒计时/title link rel='样式表href=' CSS/common。CSS ' type=' text/CSS ' charset=' utf-8 '/style type=' text/CSS ' * { margin :0；划水：0;} .dtime { margin:10px }。dtime span { color : # C30 }/style/head body div class=' dtime ' id=' a1 '/div class=' dtime ' id=' a2 '/div class=' dtime ' id=' a3 '/div class=' dtime ' id=' a4 '/div class=' dtime ' id=' a5 '/div/body脚本函数tbdtime倒计时(args){//倒计时函数var ele=文档。getelementbyid(args。id)；var all time=args。一直如此；var arr=[]；var t=数学。楼层(一直/(24 * 60 * 60))；var yt=所有时间(24 * 60 * 60)；var s=数学。楼层(yt/(60 * 60))；var ys=yt %(60 * 60)；var f=数学。楼层(ys/(60))；var YF=ys(60%)；var m=yfarr[0]=[t，]天'];arr[1]=[s，]小时'];arr[2]=[f，]分'];arr[3]=[m，]秒结束'];var s=ce(arr，0)；埃勒。innerhtml=s；var东东=setInterval(function(){ all time-=1；if(all time=0){ clearInterval(dong)；ele.innerHTML='span0/span秒；啊。end()；} else { t=数学。楼层(一直/(24 * 60 * 60))；yt=所有时间(24 * 60 * 60)；s=数学。楼层(yt/(60 * 60))；ys=yt %(60 * 60)；f=数学。楼层(ys/(60))；YF=年(60%)；m=yfarr[0]=[t，]天'];arr[1]=[s，]小时'];arr[2]=[f，]分'];arr[3]=[m，]秒结束'];var s=ce(arr，0)；埃勒。innerhtml=s；};},1000);函数ce(arr，sta){ var I=sta；if(iarr.length){ if(arr[i][0]！=0){ var s=' '；for(var j=I；贾尔长度；j){ s=' span ' arr[j][0]'/span ' arr[j][1]；};返回s；}else{ return ce(arr，I ^ 1)；};};};};//倒计时end //效果1//86402 3602 62 tdtime倒计时({id:'a1 '，//含有倒计时容器alltime:3，//倒计时总秒数end:function(){//倒计时结束，时间为0是调用的函数//alert('倒计时结束才会执行！');}, });//效果2tb时间倒计时({id:'a2 '，//含有倒计时容器alltime:62，//倒计时总秒数end:function(){//倒计时结束，时间为0是调用的函数}, });//效果3tbdtime倒计时({id:'a3 '，//含有倒计时容器alltime:3602，//倒计时总秒数end:function(){//倒计时结束，时间为0是调用的函数}, });//效果4tbdtime倒计时({id:'a4 '，//含有倒计时容器alltime:86402，//倒计时总秒数end:function(){//倒计时结束，时间为0是调用的函数}, });//效果4tbdtime倒计时({id:'a5 '，//含有倒计时容器alltime:154789，//倒计时总秒数end:function(){//倒计时结束，时间为0是调用的函数}, });/script/html2 .倒计时2.html

！DOCTYPE html html head meta charset=' utf-8 '/title倒计时/title link rel='样式表href=' CSS/common。CSS ' type=' text/CSS ' charset=' utf-8 '/style type=' text/CSS ' * { margin :0；划水：0;} .dtime { margin:10px }。dtime span { color : # C30 }/style/head body div class=' dtime ' id=' a1 ' all time=' 3 '/div class=' dtime ' id=' a2 ' all time=' 62 '/div class=' dtime ' id=' a3 ' all time=' 3605 '/div class=' dtime ' id=' a4 ' all time=' 48605 '/div class=' dtime ' id=' a5 ' all time=' 123456 '/'脚本函数tbdtime倒计时函数var ele=文档。getelementbyid(args。id)；始终变化=数字(元素。GetAttribute(args。所有时间))；var arr=[]；var t=数学。楼层(一直/(24 * 60 * 60))；var yt=所有时间(24 * 60 * 60)；var s=数学。楼层(yt/(60 * 60))；var ys=yt %(60 * 60)；var f=数学。楼层(ys/(60))；var YF=ys(60%)；var m=yfarr[0]=[t，]天'];arr[1]=[s，]小时'];arr[2]=[f，]分'];arr[3]=[m，]秒结束'];var s=ce(arr，0)；埃勒。innerhtml=s；var东东=setInterval(function(){ all time-=1；ele.setAttribute(args.alltime，all time)；if(all time=0){ clearInterval(dong)；ele.innerHTML='span0/span秒；啊。end()；} else { t=数学。楼层(一直/(24 * 60 * 60))；yt=所有时间(24 * 60 * 60)；s=数学。楼层(yt/(60 * 60))；ys=yt %(60 * 60)；f=数学。楼层(ys/(60))；YF=年(60%)；m=yfarr[0]=[t，]天'];arr[1]=[s，]小时'];arr[2]=[f，]分'];arr[3]=[m，]秒结束'];var s=ce(arr，0)；埃勒。innerhtml=s；};},1000);函数ce(arr，sta){ var I=sta；if(iarr.length){ if(arr[i][0]！=0){ var s=' '；for(var j=I；贾尔长度；j){ s=' span ' arr[j][0]'/span ' arr[j][1]；};返回s；}else{ return ce(arr，I ^ 1)；};};};};//倒计时end //效果1//86402 3602 62 tdtime倒计时({id:'a1 '，//含有倒计时容器alltime:'alltime '，//倒计时总秒数end:function(){//倒计时结束，时间为0是调用的函数警报('倒计时结束才会执行！');}, });//效果2tb时间倒计时({id:'a2 '，//含有倒计时容器alltime:'alltime '，//倒计时总秒数end:function(){//倒计时结束，时间为0是调用的函数}, });//效果3tbdtime倒计时({id:'a3 '，//含有倒计时容器alltime:'alltime '，//倒计时总秒数end:function(){//倒计时结束，时间为0是调用的函数}, });//效果4tbdtime倒计时({id:'a4 '，//含有倒计时容器alltime:'alltime '，//倒计时总秒数end:function(){//倒计时结束，时间为0是调用的函数}, });//效果4tbdtime倒计时({id:'a5 '，//含有倒计时容器alltime:'alltime '，//倒计时总秒数end:function(){//倒计时结束，时间为0是调用的函数}, });/script/html大家可以参考专题《js倒计时功能汇总》 进行深入学习。

以上就是本文的全部内容，希望对大家学习Java脚本语言程序设计有所帮助。