亚洲中字慕日产2020,大陆极品少妇内射AAAAAA,无码av大香线蕉伊人久久,久久精品国产亚洲av麻豆网站

資訊專欄INFORMATION COLUMN

js筆記系列之--時間及時間戳

paulli3 / 2108人閱讀

摘要：入門系列之時間及時間戳時間及時間戳時間及時間戳是里面很常見的一個概念，在我們寫前端頁面的時候，經(jīng)常會遇到需要獲取當前時間的情況，所以，了解中的時間概念非常重要。

js入門系列之
時間及時間戳 時間及時間戳

時間及時間戳是js里面很常見的一個概念，在我們寫前端頁面的時候，經(jīng)常會遇到需要獲取當前時間的情況，所以，了解js中的時間概念非常重要。而時間戳是指格林威治時間1970年01月01日00時00分00秒(北京時間1970年01月01日08時00分00秒)起至現(xiàn)在的總秒數(shù)，在關(guān)于時間的計算中也起著不可替代的作用。下面我們通過代碼來認識一下他們。首先，我們先通過代碼獲取當前時間:

var time=new Date();
var timeTamp=time.getTime();
text.innerHTML="time:"+time+" 
timeTamp:"+timeTamp;

如圖所示，我們所得到的time就是js中Date對象的實例，在不添加任意參數(shù)的情況下我們可以得到當前的時間，而通過getTime我們可以把Date實例轉(zhuǎn)化為時間戳。通過代碼運行結(jié)果我們可以看到，time一般是一個字符串，而timeTamp則是一個純數(shù)字，所以我們一般把time用來顯示，而把timeTamp用來計算~
既然提到了時間，那么肯定關(guān)系到了時間上的計算。先不急，我們先來熟悉一下關(guān)于Date對象的函數(shù)，常見的有g(shù)etFullYear,getMonth,getDate,getMinute,getSecond,我們用代碼看一下他們的作用:

var text=document.getElementById("text"); 
var time=new Date();
var timeTamp=time.getTime();
var year=time.getFullYear();
var month=time.getMonth();
var date=time.getDate();
var hour=time.getHours();
var minute=time.getMinutes();
var second=time.getSeconds();
text.innerHTML="time:"+time+"
timeTamp:"+timeTamp+"
year:"+year+"
month:"+month+"
date:"+date+"
hour:"+hour+"
minute:"+minute+"
second:"+second;

從圖中我們可以看到關(guān)于時間的每部分我們都可以多帶帶得出，使得后續(xù)時間計算尤為方便。提示一下：多帶帶返回的月份是從0開始算的，結(jié)果中返回了4，也就是代表是五月。那么既然有g(shù)et方法，就有對應(yīng)的set方法，這里小編只介紹setFullYear方法，其他的就讓讀者們自己去挖掘把。

var time=new Date(); 
var timeTamp=time.getTime();
time.setFullYear(2018,4,20);
text.innerHTML="time:"+time;

setFullYear可以幫我們將time設(shè)定為我們期待的時間，這在實際中是非常實用的，尤其是寫倒計時之類的demo。相似的還有parse函數(shù),只不過它返回的是指定時間的時間戳，這兩個函數(shù)各有所用之地，作用相似：

var toTamp=Date.parse("12 19,2015"); 
text.innerHTML="toTamp:"+toTamp;

下面我們利用現(xiàn)有的函數(shù)寫一個倒計時，是到2018-5-20號的：

var text=document.getElementById("text");
var toTamp=Date.parse("5 20,2018");
setInterval(function(){
var time=new Date();
var timeTamp=time.getTime();
var overTamp=toTamp-timeTamp;
var overTime=new Date(overTamp);
overTime.setFullYear(overTime.getFullYear()-1970);
overTime.setHours(overTime.getHours()-8);
var oyear=overTime.getFullYear();
var omonth=overTime.getMonth();
var odate=overTime.getDate();
var ohour=overTime.getHours();
var ominute=overTime.getMinutes();
var osecond=overTime.getSeconds();
text.innerHTML="離2018-5-20剩余時間還有：
"+oyear+"年"+omonth+"月"+odate+"天"+ohour+"時"+ominute+"分"+osecond+"秒";
},1000);

這是一個十分簡易的倒計時，但是所用到的代碼確實不多而且簡潔，雖然不一定是最精確的，但是應(yīng)該算是最簡單的一種方法了。而當你為這個倒計時加上酷炫的特效時，我想你會喜歡上他的~
作為一個新手小白，我也是在前端的道路上不斷摸索著。不要因為知識點簡單或者不高大上就不去研習，眼光上的盲目會讓你的項目搖搖欲墜。以人為戒，以己為戒。

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://www.ezyhdfw.cn/yun/51790.html

相關(guān)文章

  • js筆記系列之--時間及時間戳

    摘要：入門系列之時間及時間戳時間及時間戳時間及時間戳是里面很常見的一個概念，在我們寫前端頁面的時候，經(jīng)常會遇到需要獲取當前時間的情況，所以，了解中的時間概念非常重要。 js入門系列之 時間及時間戳 時間及時間戳 時間及時間戳是js里面很常見的一個概念，在我們寫前端頁面的時候，經(jīng)常會遇到需要獲取當前時間的情況，所以，了解js中的時間概念非常重要。而時間戳是指格林威治時間1970年01月0...

    wapeyang 評論0 收藏0

  • 后臺開發(fā)常問面試題集錦（問題搬運工，附鏈接）

    摘要：基礎(chǔ)問題的的性能及原理之區(qū)別詳解備忘筆記深入理解流水線抽象關(guān)鍵字修飾符知識點總結(jié)必看篇中的關(guān)鍵字解析回調(diào)機制解讀抽象類與三大特征時間和時間戳的相互轉(zhuǎn)換為什么要使用內(nèi)部類對象鎖和類鎖的區(qū)別，，優(yōu)缺點及比較提高篇八詳解內(nèi)部類單例模式和 Java基礎(chǔ)問題 String的+的性能及原理 java之yield(),sleep(),wait()區(qū)別詳解-備忘筆記 深入理解Java Stream流水...

    spacewander 評論0 收藏0

  • 后臺開發(fā)常問面試題集錦（問題搬運工，附鏈接）

    摘要：基礎(chǔ)問題的的性能及原理之區(qū)別詳解備忘筆記深入理解流水線抽象關(guān)鍵字修飾符知識點總結(jié)必看篇中的關(guān)鍵字解析回調(diào)機制解讀抽象類與三大特征時間和時間戳的相互轉(zhuǎn)換為什么要使用內(nèi)部類對象鎖和類鎖的區(qū)別，，優(yōu)缺點及比較提高篇八詳解內(nèi)部類單例模式和 Java基礎(chǔ)問題 String的+的性能及原理 java之yield(),sleep(),wait()區(qū)別詳解-備忘筆記 深入理解Java Stream流水...

    xfee 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<