js实现倒计时及时间对象
Posted SnowLover
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了js实现倒计时及时间对象相关的知识，希望对你有一定的参考价值。
JS实现倒计时效果代码如下：
1 <!doctype html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>无标题文档</title>h 6 <style> 7 #box { 8 width: 100%; 9 height: 400px; 10 background: black; 11 color: #fff; 12 font-size:40px; 13 line-height:400px; 14 text-align:center; 15 } 16 </style> 17 <script> 18 window.onload = function(){ 19 var oBox = document.getElementById(\'box\'); 20 var oDate = new Date();//获取当前时间; 21 oDate.setFullYear(2016,11,31);//自动进位； 22 oDate.setHours(0,0,0,0); 23 24 function countDown(){ 25 //未来时间戳减去现在时间的时间戳; 26 var ms = oDate.getTime() - new Date().getTime(); 27 28 //毫秒转换成秒 29 var oSec = parseInt(ms/1000); 30 31 //秒转换成天 32 var oDay = parseInt(oSec/86400); 33 34 //不到一天剩下的秒数; 35 oSec%=86400; 36 37 //转换成小时 38 var oHour = parseInt(oSec/3600); 39 40 //不到一小时剩下的秒数; 41 oSec%=3600; 42 43 //转换成分钟 44 var oMin = parseInt(oSec/60); 45 46 //不到一分钟剩下的秒数; 47 oSec%=60; 48 49 oBox.innerHTML = \'距离2016年12月31日还有:\'+oDay+\'天\'+oHour+\'时\'+oMin+\'分\'+oSec+\'秒\'; 50 } 51 countDown(); 52 setInterval(countDown,1000); 53 } 54 </script> 55 </head> 56 57 <body> 58 <div id="box">距离2016年12月31日还有:xx天xx时xx分xx秒</div> 59 </body> 60 </html>
实现效果入下：
时间戳：1970年1月日至今的毫秒数:oDate.getTime(); //不要问我为什么是1970年1月至今哦！自个儿百度啦！
时间对象:
获取时间:
var oDate = new Date();
oYear = oDate.getFullYear();
oMon = oDate.getMonth();
oDay = oDate.getDate();
oHou = oDate.getHours();
oMin = oDate.getMinutes();
oSec = oDate.getSeconds();
oWeek = oDate.getDay();
设置时间:
oDate.setFullYear(年,月,日);
oDate.setMonth(月);
oDate.setDate(日);
oDate.setHours(时,分,秒,毫秒);
时间会自动进位;
大概整理的就这些，还有很多不足的地方，希望大家多提宝贵意见！互相学习！互相取经！~ ~ ^_^
以上是关于js实现倒计时及时间对象的主要内容，如果未能解决你的问题，请参考以下文章
JS实现60s倒计时(亲测有效)，及span标签如何使用和禁用onclick事件