2018-07-13

Date

日期对象的API

年：FullYear
月：Month
日：Date
星期：Day
小时：Hours
分钟：Minutes
秒：Seconds
毫秒：Millseconds

时间定时器

一次定时器
    setTimeout
永久定时器
    setInterval
停止定时器 
    clearTimeout
停止定时器
    clearInterval

现在时间实例

setTimeout(function() {
        var a = new Date(); //获取当前时间
        var year = a.getFullYear(); //年
        var month = a.getMonth(); //月
        var dat = a.getDate(); //日
        var day = a.getDay(); //周
        var hour = a.getHours(); //时
        var min = a.getMinutes(); //分
        var sec = a.getSeconds(); //秒
        document.getElementById('date').innerHTML = '现在时间' + year + '年' + month + '月' + dat + '日，星期' + day + '\t' + hour + '时' + min + '分' + sec + '秒'; //最后拼接在一块
    },2000)

开始、停止倒计时实例

HTML代码

<div class="date">
    <button id="btn">开始计时</button>
    <button id="btn1">停止计时</button>
    <p id="dome1"></p>
    <p id="dome"></p>
</div>

js代码

var btn = document.getElementById('btn');
    var btn1 = document.getElementById('btn1');
    btn.onclick = function() {
        btn1.style.display = 'block';
        btn.style.display = 'none';
        var fun = setInterval(function() {
            var date1 = new Date('2018/09/02 18:00:00');
            var date2 = new Date();
            var old = date1.getTime();
            var now = date2.getTime();
            var time = old - now;
            var moth = Math.floor(time / (1000 * 60 * 60 * 24));
            var moth2 = time % (1000 * 60 * 60 * 24);
            var hour = Math.floor(moth2 / (1000 * 60 * 60));
            var hour2 = time % (1000 * 60 * 60);
            var min = Math.floor(hour2 / (1000 * 60));
            var min2 = time % (1000 * 60);
            var sec = Math.floor(min2 / (1000));
            document.getElementById('dome1').innerHTML = '距离开学还有' + '<br />';
            document.getElementById('dome').innerHTML = +moth + '日' + hour + '时' + min + '分' + sec + '秒';
        })
        btn1.onclick = function() {
            btn1.style.display = 'none';
            btn.style.display = 'block';
            clearInterval(fun);
        }
    }