abstract:<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>jquery案例——五一勞動節(jié)倒計(jì)時(shí)</title> <script src="https://code.jquery.com/jque
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>jquery案例——五一勞動節(jié)倒計(jì)時(shí)</title> <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script> <style type="text/css"> *{margin: 0;padding: 0} body{background-color: #333;} .box{width: 70%;height: 200px; line-height: 200px;text-align: center;color: #fff; margin: 50px auto;background: hsla(0,0%,100%,.15);border-radius: 20px;font-size: 35px;letter-spacing: 15px;} </style> </head> <body> <p class="box">距離五一勞動節(jié)還有<span id="date"></span></p> <script type="text/javascript"> // 勞動節(jié)倒計(jì)時(shí): // 分析:得到勞動節(jié)那天到1970年的總毫秒數(shù) 減去 現(xiàn)在到1970年的總毫秒數(shù),在換算天,小時(shí),分鐘,秒 $(function(){ function Ro(){ //parse 方法可解析一個(gè)日期時(shí)間字符串,并返回1970/1/1 午夜距離該日期的毫秒數(shù) $ftime = Date.parse('May 01 2019'); //得到勞動節(jié)距離1970年的總毫秒數(shù) $dtime = new Date(); //獲取當(dāng)前日期時(shí)間字符串 $time = $dtime.getTime(); //得到當(dāng)前時(shí)間距離1970年的總毫秒數(shù) $zmiao = Math.floor(($ftime-$time)/1000); //得到現(xiàn)在時(shí)間距離勞動節(jié)的總秒數(shù) $day = Math.floor($zmiao/86400); //得到天數(shù) 一天等于86400秒 $hours = Math.floor($zmiao%86400/3600); //取余 得到一天剩下的秒數(shù),在除以3600得到小時(shí) $mins = Math.floor($zmiao%3600/60);//總秒數(shù)除以3600得到還剩多少小時(shí)和多少秒,取余得到還有多少秒,在除以60得到分鐘 $second = Math.floor($zmiao%60); //總秒數(shù)除以60得到還剩多少分鐘,取余得到還有多少秒 $('#date').text($day+'天'+$hours+'小時(shí)'+$mins+'分鐘'+$second+'秒'); } setInterval(Ro,1000); }) </script> </body> </html>
Correcting teacher:天蓬老師Correction time:2019-04-10 10:40:32
Teacher's summary:清明剛過, 就惦記著五一放假 了, 看來清明沒有玩好, 代碼寫得不錯(cuò), 繼續(xù)努力吧