js實(shí)現(xiàn)倒計(jì)時(shí)及時(shí)間對(duì)象

更新時(shí)間：2016年11月15日 08:41:29 作者：ALI-LILI

這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)倒計(jì)時(shí)效果及時(shí)間對(duì)象,具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下

JS實(shí)現(xiàn)倒計(jì)時(shí)效果代碼如下：

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>無(wú)標(biāo)題文檔</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();//獲取當(dāng)前時(shí)間;
 oDate.setFullYear(2016,11,31);//自動(dòng)進(jìn)位；
 oDate.setHours(0,0,0,0);

 function countDown(){
  //未來時(shí)間戳減去現(xiàn)在時(shí)間的時(shí)間戳;
  var ms = oDate.getTime() - new Date().getTime();

  //毫秒轉(zhuǎn)換成秒
  var oSec = parseInt(ms/1000);

  //秒轉(zhuǎn)換成天
  var oDay = parseInt(oSec/86400);

  //不到一天剩下的秒數(shù);
  oSec%=86400;

  //轉(zhuǎn)換成小時(shí)
  var oHour = parseInt(oSec/3600);

  //不到一小時(shí)剩下的秒數(shù);
  oSec%=3600;

  //轉(zhuǎn)換成分鐘
  var oMin = parseInt(oSec/60);

  //不到一分鐘剩下的秒數(shù);
  oSec%=60;

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

<body>
<div id="box">距離2016年12月31日還有:xx天xx時(shí)xx分xx秒</div>
</body>
</html>

實(shí)現(xiàn)效果入下：

時(shí)間戳：1970年1月日至今的毫秒數(shù):oDate.getTime(); //不要問我為什么是1970年1月至今哦！自個(gè)兒百度啦！
時(shí)間對(duì)象:

獲取時(shí)間:

  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();

設(shè)置時(shí)間:

  oDate.setFullYear(年,月,日);
  oDate.setMonth(月);
  oDate.setDate(日);
  oDate.setHours(時(shí),分,秒,毫秒);
  時(shí)間會(huì)自動(dòng)進(jìn)位;

大概整理的就這些，還有很多不足的地方，希望大家多提寶貴意見！互相學(xué)習(xí)！互相取經(jīng)！

您可能感興趣的文章:

相關(guān)文章

基于JavaScript實(shí)現(xiàn)數(shù)值型坐標(biāo)軸刻度計(jì)算算法(echarts的y軸刻度計(jì)算)
這篇文章主要介紹了基于JavaScript實(shí)現(xiàn)數(shù)值型坐標(biāo)軸刻度計(jì)算算法(echarts的y軸刻度計(jì)算),文章圍繞主題展開詳細(xì)的內(nèi)容介紹，感興趣的朋友可以參考與一下
2022-06-06
實(shí)現(xiàn)圖片首尾平滑輪播(JS原生方法—節(jié)流)
下面小編就為大家?guī)硪黄獙?shí)現(xiàn)圖片首尾平滑輪播(JS原生方法—節(jié)流)。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2017-10-10
詳解微信小程序應(yīng)用和頁(yè)面生命周期
生命周期是指一個(gè)對(duì)象從創(chuàng)建→>運(yùn)行>銷毀的整個(gè)階段，強(qiáng)調(diào)的是一個(gè)時(shí)間段，文中介紹了生命周期的分類和微信小程序應(yīng)用，需要的朋友可以參考下
2022-08-08
Uncaught?SyntaxError:Unexpected?token?'<'?(
這篇文章主要為大家介紹了JS判斷趨近于直線的多邊形(退化多邊形)實(shí)例探究，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪
2024-01-01
淺談layui 表單元素的選中問題
今天小編就為大家分享一篇淺談layui 表單元素的選中問題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧
2019-10-10
Javascript遞歸打印Document層次關(guān)系實(shí)例分析
這篇文章主要介紹了Javascript遞歸打印Document層次關(guān)系的方法,實(shí)例分析了javascript中Document的層次關(guān)系,需要的朋友可以參考下
2015-05-05
Javascript 類的繼承實(shí)現(xiàn)代碼
JavaScript中類的學(xué)習(xí)，從基本類繼承過來方法。
2009-07-07
javascript 返回?cái)?shù)組中不重復(fù)的元素
返回?cái)?shù)組中不重復(fù)的元素的js實(shí)現(xiàn)代碼。
2009-12-12
ES6新特性：使用export和import實(shí)現(xiàn)模塊化詳解
本篇文章主要介紹了ES6新特性：使用export和import實(shí)現(xiàn)模塊化詳解，具有一定的參考價(jià)值，有興趣的可以了解一下
2017-07-07
JS+CSS實(shí)現(xiàn)電子商務(wù)網(wǎng)站導(dǎo)航模板效果代碼
這篇文章主要介紹了JS+CSS實(shí)現(xiàn)電子商務(wù)網(wǎng)站導(dǎo)航模板效果代碼,涉及JavaScript結(jié)合css動(dòng)態(tài)操作頁(yè)面元素屬性的相關(guān)技巧,非常具有實(shí)用價(jià)值,需要的朋友可以參考下
2015-09-09