js實現(xiàn)倒計時及時間對象
JS實現(xiàn)倒計時效果代碼如下:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>無標(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)前時間;
oDate.setFullYear(2016,11,31);//自動進位;
oDate.setHours(0,0,0,0);
function countDown(){
//未來時間戳減去現(xiàn)在時間的時間戳;
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)換成小時
var oHour = parseInt(oSec/3600);
//不到一小時剩下的秒數(shù);
oSec%=3600;
//轉(zhuǎn)換成分鐘
var oMin = parseInt(oSec/60);
//不到一分鐘剩下的秒數(shù);
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>
實現(xiàn)效果入下:

時間戳:1970年1月日至今的毫秒數(shù):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();
設(shè)置時間:
oDate.setFullYear(年,月,日); oDate.setMonth(月); oDate.setDate(日); oDate.setHours(時,分,秒,毫秒); 時間會自動進位;
大概整理的就這些,還有很多不足的地方,希望大家多提寶貴意見!互相學(xué)習(xí)!互相取經(jīng)!
相關(guān)文章
基于JavaScript實現(xiàn)數(shù)值型坐標(biāo)軸刻度計算算法(echarts的y軸刻度計算)
這篇文章主要介紹了基于JavaScript實現(xiàn)數(shù)值型坐標(biāo)軸刻度計算算法(echarts的y軸刻度計算),文章圍繞主題展開詳細的內(nèi)容介紹,感興趣的朋友可以參考與一下2022-06-06
實現(xiàn)圖片首尾平滑輪播(JS原生方法—節(jié)流)
下面小編就為大家?guī)硪黄獙崿F(xiàn)圖片首尾平滑輪播(JS原生方法—節(jié)流)。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2017-10-10
Uncaught?SyntaxError:Unexpected?token?'<'?(
這篇文章主要為大家介紹了JS判斷趨近于直線的多邊形(退化多邊形)實例探究,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪2024-01-01
Javascript遞歸打印Document層次關(guān)系實例分析
這篇文章主要介紹了Javascript遞歸打印Document層次關(guān)系的方法,實例分析了javascript中Document的層次關(guān)系,需要的朋友可以參考下2015-05-05
javascript 返回數(shù)組中不重復(fù)的元素
返回數(shù)組中不重復(fù)的元素的js實現(xiàn)代碼。2009-12-12
ES6新特性:使用export和import實現(xiàn)模塊化詳解
本篇文章主要介紹了ES6新特性:使用export和import實現(xiàn)模塊化詳解,具有一定的參考價值,有興趣的可以了解一下2017-07-07
JS+CSS實現(xiàn)電子商務(wù)網(wǎng)站導(dǎo)航模板效果代碼
這篇文章主要介紹了JS+CSS實現(xiàn)電子商務(wù)網(wǎng)站導(dǎo)航模板效果代碼,涉及JavaScript結(jié)合css動態(tài)操作頁面元素屬性的相關(guān)技巧,非常具有實用價值,需要的朋友可以參考下2015-09-09

