您的位置：首页 > Web前端 > JavaScript

js实现倒计时及时间对象

2016-11-15 00:00 597 查看

JS实现倒计时效果代码如下：

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>h
<style>
#box {
width: 100%;
height: 400px;
background: black;
color: #fff;
font-size:40px;
line-height:400px;
text-align:center;
}
</style>
<script>
window.onload = function(){
var oBox = document.getElementById('box');
var oDate = new Date();//获取当前时间;
oDate.setFullYear(2016,11,31);//自动进位；
oDate.setHours(0,0,0,0);

function countDown(){
//未来时间戳减去现在时间的时间戳;
var ms = oDate.getTime() - new Date().getTime();

//毫秒转换成秒
var oSec = parseInt(ms/1000);

//秒转换成天
var oDay = parseInt(oSec/86400);

//不到一天剩下的秒数;
oSec%=86400;

//转换成小时
var oHour = parseInt(oSec/3600);

//不到一小时剩下的秒数;
oSec%=3600;

//转换成分钟
var oMin = parseInt(oSec/60);

//不到一分钟剩下的秒数;
oSec%=60;

oBox.innerHTML = '距离2016年12月31日还有:'+oDay+'天'+oHour+'时'+oMin+'分'+oSec+'秒';
}
countDown();
setInterval(countDown,1000);
}
</script>
</head>

<body>
<div id="box">距离2016年12月31日还有:xx天xx时xx分xx秒</div>
</body>
</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实现精确到毫秒的倒计时效果
javascript时间排序算法实现活动秒杀倒计时效果
实例讲解多个js毫秒倒计时同时进行效果
js倒计时抢购实例
js代码实现点击按钮出现60秒倒计时
js实现n秒倒计时后才可以点击的效果
js实现新年倒计时效果
js实现点击获取验证码倒计时效果
JS 倒计时实现代码(时、分，秒)
简单易用的倒计时js代码

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： js 倒计时时间对象

相关文章推荐

新的分享

章节导航