javascript內(nèi)置對象Date案例總結(jié)分析
Date的基本使用
內(nèi)置對象Date是構(gòu)造函數(shù),用new創(chuàng)建對象,無參數(shù)時返回當(dāng)前時間,可加參數(shù)返回特定時間
//內(nèi)置對象Date是構(gòu)造函數(shù),用new創(chuàng)建對象,無參數(shù)時返回當(dāng)前時間,可加參數(shù)返回特定時間 var now_time = new Date(); console.log(now_time); // 年月日之間可以用-或者/ var time_1 = new Date('2018-05-06 12:36:15'); var time_2 = new Date('2018/05/06'); console.log(time_1); console.log(time_2);
格式化時間
可以從上圖看到返回的時間格式 Sun May 06 2018 00:00:00 GMT+0800 (中國標準時間) 不符合我們中國人的表示習(xí)慣
所以我們需要獲取日期的指定部分,然后進行日期格式化。
方法名 | 說明 | 代碼 |
---|---|---|
getFullYear() | 獲取當(dāng)年 | Obj.getFullYear() |
getMonth() | 獲取當(dāng)月,返回0 -11 | Obj.getMonth() |
getDate() | 獲取當(dāng)天日期 | Obj.getDate() |
getDay() | 獲取星期幾(周日0 到 周六6) | Obj.getDay() |
getHours() | 獲取當(dāng)前小時 | Obj.getHours() |
getMinutes() | 獲取當(dāng)前分鐘 | Obj.getMinutes() |
getSeconds() | 獲取當(dāng)前秒鐘 | Obj.getSeconds() |
1.格式化日期 - 年,月,日
//格式化日期- 年,月,日 var date = new Date(); // 實例化一個日期對象 var year = date.getFullYear(); // 返回當(dāng)前日期年份 var month = date.getMonth() + 1; //返回的是0-11,分別對應(yīng)1-12月,所以接果+1才是正確的月數(shù) year = year < 10? '0' + year: year ; var dates = date.getDate(); // 返回幾號 dates = dates < 10? '0' + dates: dates ; var day = date.getDay(); //返回的是0-6,分別對應(yīng)星期天-星期六 var day_arr = ['星期天','星期一','星期二','星期三','星期四','星期五','星期六',] console.log('今天是:'+ year + '年' + month + '月' + dates + '日' + day_arr[day]);
2.格式化時,分,秒
function getTime(){ var time = new Date(); var h = time.getHours(); h = h < 10? '0' + h: h; var m = time.getMinutes(); m = m < 10? '0' + m: m; var s = time.getSeconds(); s = s < 10? '0' + s: s; return h + ':' + m + ':' + s ; } console.log(getTime());
獲取Date總的毫秒數(shù)(時間戳)
我們時??梢钥吹綍r間戳,那么他是怎么來的呢?
其實時間戳表示的是從1970年1月1號到當(dāng)前時間的總的毫秒數(shù)。
至于為什么是1970年的這個時間,感興趣的可以百度看看,十分有趣。
在我們javascript中獲取時間戳有三種方法。
//獲取Date總的毫秒數(shù)(時間戳) ,是從1970年1月1號到當(dāng)前的總的毫秒數(shù) 至于為什么是這個時間,感興趣的可以百度看看,十分有趣 //1.通過 valueOf() 或者 getTime() 方法 var date = new Date(); console.log(date.valueOf()); //得到的是我們當(dāng)前時間距離1970 1.1的總的毫秒數(shù) console.log(date.getTime()); //2.簡單的寫法(最常用的寫法) var date = +new Date(); console.log(date); //3.H5 新增的,ie9以下不適用 console.log(Date.now());
案例-網(wǎng)頁倒計時核心算法(重要)
1)核心算法:輸入的時間減去現(xiàn)在的時問就是利余的時問,即倒計時,但是不能拿著時分秒相減,比如05分減去25分,結(jié)果會是負數(shù)的。
2)用時間載來做。用戶輸入時間總的老秒數(shù)減去現(xiàn)在時間的總的毫秒數(shù),得到的就是剩余時間的毫秒數(shù)。
3)把剩余時間總的毫秒數(shù)化為秒然后轉(zhuǎn)換為天、時、分、秒(時間轉(zhuǎn)換為時分秒)
轉(zhuǎn)換公式下:
d = parselnt (總秒數(shù)/60/60/24); 計算天數(shù)
h = parselnt (總秒數(shù)/60/60%24); 計算小時
m = parselnt (總秒數(shù)/60%60); 計算分數(shù)
s = parselnt (總秒數(shù)%60); 計算當(dāng)前秒數(shù)
//網(wǎng)頁倒計時核心算法 function countTime(time){ var newTime = +new Date(); //獲取當(dāng)前總的毫秒數(shù)(時間戳) var inputTime = +new Date(time); // 得到指定時間的時間戳 var times = (inputTime - newTime) / 1000; // 剩余時間的秒數(shù) var d = parseInt(times / 60 / 60 / 24); // 天數(shù) ,取整 d = d<10 ? '0'+d : d; // 補零 var h = parseInt(times / 60 / 60 % 24); // 時 h = h<10 ? '0'+h : h; var m = parseInt(times / 60 % 60); //分 m = m<10 ? '0'+m : m; var s = parseInt(times % 60); //秒 s = s<10 ? '0'+s : s; return d + '天' + h + '時' + m + '分' + s + '秒'; } console.log(countTime('2022-03-01 18:00:00'));
結(jié)語
以上就是javascript內(nèi)置對象Date案例總結(jié)分析的詳細內(nèi)容,更多關(guān)于javascript內(nèi)置對象Date的資料請關(guān)注腳本之家其它相關(guān)文章!
相關(guān)文章
JavaScript SweetAlert插件實現(xiàn)超酷消息警告框
SweetAlert是一款使用純js制作的消息警告框插件.這篇文章主要介紹了JavaScript SweetAlert插件實現(xiàn)超酷消息警告框的相關(guān)資料,需要的朋友可以參考下2016-01-01JavaScript原生數(shù)組函數(shù)實例匯總
這篇文章主要介紹了JavaScript原生數(shù)組函數(shù)實例匯總,文中通過示例代碼介紹的非常詳細,對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下2020-10-10Bootstrap CSS組件之按鈕組(btn-group)
這篇文章主要為大家詳細介紹了Bootstrap CSS組件之按鈕組(btn-group),具有一定的參考價值,感興趣的小伙伴們可以參考一下2016-12-12JavaScript中利用Array filter() 方法壓縮稀疏數(shù)組
Array filter() 方法會跳過稀疏數(shù)組中缺少的元素,它的返回數(shù)組總是稠密的。這篇文章給大家介紹了JavaScript中利用Array filter() 方法壓縮稀疏數(shù)組的相關(guān)知識,需要的朋友參考下2018-02-02window.location.href和window.open窗口跳轉(zhuǎn)區(qū)別解析
這篇文章主要為大家介紹了window.location.href和window.open 跳轉(zhuǎn)區(qū)別解析,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪2023-07-07