老师这个是怎么回事
<!doctype html> <html> <head> <title>练习BOM</title> <meta http-equiv="content-type" content="text/html;charset=UTF-8"/> <style type="text/css"> .one{ width:400px; height:100px; margin:120px auto; background-color:#dcdcdc; text-align:center; line-height:100px; border:1px red solid; position:relative; } .one span:nth-child(1){ width:auto; height:auto; position:absolute; left:28px; top:38px; font-size:18px; font-weight:bold; color:#000; } .one .two{ display:inline-block; width:19px; height:auto; font-size:18px; font-weight:bold; color:#666; } .one span{ font:bold 21px "宋体",sans-serif; color:#666; } </style> <script type="text/javascript"> window.onload=b; var s=new Date(); var x=0,f=2,m=59; function b(){ var M=59; var q=document.getElementsByClassName('two'); var a=new Date(2017,0,0,x,f,m); q[0].innerHTML=a.getHours(); q[1].innerHTML=a.getMinutes(); q[2].innerHTML=a.getSeconds(); m-=1; var c=setTimeout(b,10); console.log(a); if(a.getMinutes()==0 && a.getSeconds()==0){ clearTimeout(c); alert('抢购已结束!!!'); a.setHours(x); a.setMinutes(f); a.setSeconds(M); q[0].innerHTML=a.getHours(); q[1].innerHTML=a.getMinutes(); q[2].innerHTML=a.getSeconds(); } } </script> </head> <body> <div class="one"> <span>距抢购结束:</span> <div class="two">23</div> <span>:</span> <div class="two">59</div> <span>:</span> <div class="two">59</div> </div> </body> </html>
0
收起
正在回答
3回答
经测试这两段代码是没有问题的哦,如下:
并没有出现你说的那种情况,刷新多次也是正常的。自己可以使用Chrome浏览器测试一下哦,祝学习愉快~~
慕神6715844
2018-08-11 00:42:20
<!doctype html> <html> <head> <title>练习BOM</title> <meta http-equiv="content-type" content="text/html;charset=UTF-8"/> <style type="text/css"> .one{ width:400px; height:100px; margin:120px auto; background-color:#dcdcdc; text-align:center; line-height:100px; border:1px red solid; position:relative; } .one span:nth-child(1){ width:auto; height:auto; position:absolute; left:28px; top:38px; font-size:18px; font-weight:bold; color:#000; } .one .two{ display:inline-block; width:19px; height:auto; font-size:18px; font-weight:bold; color:#666; } .one span{ font:bold 21px "宋体",sans-serif; color:#666; } </style> <script type="text/javascript"> window.onload=b; var x=0,f=2,m=59; function b(){ var M=59; var q=document.getElementsByClassName('two'); var a=new Date(0,0,0,x,f,m); q[0].innerHTML=a.getHours(); q[1].innerHTML=a.getMinutes(); q[2].innerHTML=a.getSeconds(); m-=1; var c=setTimeout(b,10); if(a.getMinutes()==0 && a.getSeconds()==0){ clearTimeout(c); alert('抢购已结束!!!'); a.setHours(x); a.setMinutes(f); a.setSeconds(M); q[0].innerHTML=x; q[1].innerHTML=f; q[2].innerHTML=M; } } setInterval(function(){ var s=new Date(); if(s.getMinutes()==41 && s.getSeconds()==0){ alert('开始下一轮抢购'); b(); } },800); </script> </head> <body> <div class="one"> <span>距抢购结束:</span> <div class="two">23</div> <span>:</span> <div class="two">59</div> <span>:</span> <div class="two">59</div> </div> </body> </html>
还有老师为什么 开始下一轮的时候就会变成23点59分59秒了
前端小白入门系列课程
- 参与学习 人
- 提交作业 11218 份
- 解答问题 36713 个
从一个不会编程的小白到一个老司机是需要过程的,首先得入门,学习基础知识,然后才能进阶,最后再到精通,本专题是你走进前端世界的不二选择!
了解课程
恭喜解决一个难题,获得1积分~
来为老师/同学的回答评分吧
0 星