Date日期操作基礎(chǔ)講解

Date是日期類，通過它可以對(duì)時(shí)間進(jìn)行處理

var time = new Date();  
// -> 獲取當(dāng)前客戶端本機(jī)時(shí)間(當(dāng)前獲取的時(shí)間不能作為重要的參考依據(jù))
// -> 獲取的結(jié)果是一個(gè)日期格式的對(duì)象: 
// -> Thu May 10 2018 14:14:29 GMT+0800 (中國標(biāo)準(zhǔn)時(shí)間)

typeOf new Date() // -> "object"

time.getFullYear() // -> 獲取四位整數(shù)年
time.getMonth() // -> 獲取的月 0~11,代表1~12月
time.getDate() // -> 獲取日 1~31
time.getDay() // -> 獲取星期(0~6代表周日到周六)
time.getHours() // -> 獲取小時(shí)
time.getMinutes() // -> 獲取分鐘
time.getSeconds() // -> 獲取秒
time.getMilliseconds() // -> 獲取毫秒
time.getTime() // -> 獲取當(dāng)前日期距離 '1970-01-01 00:00:00' 的毫秒差

var time = new Date('2018-05-09'); 
// -> 當(dāng)new Date中傳遞一個(gè)時(shí)間的字符串,相當(dāng)于把這個(gè)字符串轉(zhuǎn)換為標(biāo)準(zhǔn)時(shí)間對(duì)象格式(轉(zhuǎn)換完成后,就可以調(diào)取上面那些方法了)

// -> 時(shí)間格式的字符串
// -> '2018-05-09' (ie下識(shí)別不了)
// -> '2018/05/09'
// -> '2018/05/09 21:12:13'
// -> 1525933730685 (如果傳遞的是距離1970年的毫秒差,也可以識(shí)別轉(zhuǎn)換,但是只能是數(shù)字不能是字符串)
// -> ...

<style>
    .box{width:420px;height:60px;margin:100px auto;border:2px solid #aaa;text-align:center;line-height:60px;font-size: 24px;}
    .box span{color:orange;}
    
</style>
<div class='box'>距離汶川地震十周年:<span id='timeBox'>00:00:00</span>
</div>
<script>
    var timeBox = document.getElementById('timeBox');
    function compute(){
        var nowTime = new Date(),
            targetTime = new Date('2018/05/12 14:28:00');
        var spanTime = targetTime - nowTime ;// -> 獲取的結(jié)果是兩個(gè)時(shí)間之間的毫秒差
        // -> 已經(jīng)到達(dá)默哀時(shí)間,提示: 默哀三分鐘
        if(spanTime <= 0){
            timeBox.innerHTML = '開始默哀';
            window.clearInterval(timer)
            return;
        }

        // -> 還沒有到達(dá)默哀時(shí)間;在總毫秒差中計(jì)算出還有多少小時(shí),分鐘,秒
        var hour = Math.floor(spanTime / (1000*60*60));
        spanTime -= hour*60*60*1000; // -> 把小時(shí)占據(jù)的毫秒數(shù)拋出掉
        var minute = Math.floor(spanTime / (1000*60));
        spanTime -= minute*60*1000; // -> 把分鐘占據(jù)的毫秒數(shù)拋出掉
        var second = Math.floor(spanTime / 1000);
        // console.log(hour);
        // -> 如果時(shí)鐘,分鐘,秒鐘小于10,補(bǔ)零
        hour<10?hour = "0"+hour:null;
        minute<10?minute="0"+minute:null;
        second<10?second="0"+second:null;
        // -> 替換span中的內(nèi)容顯示為倒計(jì)時(shí)
        timeBox.innerHTML = hour + ":" + minute + ":" + second;
    }
    compute();

    // -> 每隔一秒鐘重新執(zhí)行compute()
    var timer = window.setInterval(compute, 1000)
</script>