效果如下:
1 <div class="warp"> 2 <p id="txt">距离”十一“国庆放假还有:</p><br> 3 <p id="time"></p> 4 </div>
javaScript源码:
1 <script> 2 $(document).ready(function(e) { 3 4 function timer() 5 { 6 //获取系统当前时间 7 var seconds; 8 var minutes; 9 var hours; 10 var days; 11 var year; 12 var mouth; 13 14 var date = new Date(); 15 seconds = date.getSeconds(); 16 minutes = date.getMinutes(); 17 hours = date.getHours(); 18 year = date.getFullYear(); 19 mouth = date.getMonth()+1; 20 days = date.getDate(); 21 22 //因为Date获取的当前时间月份是0-11,少一个月,因此需先获取到各个时间后,重新定义当前时间 23 var shiyi = new Date(2015,10,1,0,0,0); 24 var nowDate = new Date(year,mouth,days,hours,minutes,seconds); 25 26 var shiyiTime = shiyi.getTime(); 27 var nowTime = nowDate.getTime(); 28 29 var cTime = shiyiTime - nowTime; 30 var cDD = checkTime(parseInt(cTime/(1000*60*60*24),10)); 31 var cHH = checkTime(parseInt(cTime/1000/60/60%24,10)); 32 var cMM = checkTime(parseInt(cTime/1000/60%60,10)); 33 var cSS = checkTime(parseInt(cTime/1000%60,10)); 34 35 function checkTime(i) 36 { 37 if(i < 10) 38 { 39 i = "0" + i; 40 } 41 return i; 42 } 43 44 document.getElementById("time").innerHTML = cDD+"天"+cHH+"时"+cMM+"分"+cSS+"秒"; 45 } 46 setInterval(timer,1000); 47 48 }); 49 </script>