日期、时间相关场景代码

 

<div id="time"></div>

 

1.当前时间，时钟效果：

<script>
    window.onload = function(){
        showTime();
    };
    function showTime(){
        var myDate = new Date();
        var year = myDate.getFullYear();
        var month = myDate.getMonth() + 1;
        var date = myDate.getDate();
        var weekday = myDate.getDay();
        var w = new Array(6);
        w[0] = "星期日";
        w[1] = "星期一";
        w[2] = "星期二";
        w[3] = "星期三";
        w[4] = "星期四";
        w[5] = "星期五";
        w[6] = "星期六";
        var h = myDate.getHours();
        var m =myDate.getMinutes();
        var s =myDate.getSeconds();
        h = checkTime(h);
        m = checkTime(m);
        s = checkTime(s);
        document.getElementById('time').innerHTML = year + '年' + month + '月' + date + '日' + w[weekday] + h + ':' + m + ':' + s;
        setTimeout(showTime,1000);
    }
    function checkTime(i){
        if(i < 10){
            return '0'+i;
        }else{
            return i;
        }
    }
</script>

效果如下，时间一直走动：

 

2.倒数日计算：

<script>
    window.onload =function(){
        var curtime = new Date();
        var endtime = new Date('2019,12,31');
        var lefttime = endtime.getTime() -curtime.getTime();    //毫秒
        lefttime = Math.ceil(lefttime/(24*60*60*1000));
        document.getElementById('time').innerHTML = lefttime;
    }
</script>

 

结果：

 

 

 

3.限时抢，倒计时，时间一直变化：

<script>
    window.onload = function(){
        showTime();
    };
    function showTime(){
        var now = new Date();
        var end = new Date('2019/12/31,20:00:00');
        var left = parseInt((end.getTime() - now.getTime())/1000);     //秒
        var d = parseInt(left/(24*60*60));
        var h = parseInt((left/(60*60))%24);
        var m = parseInt((left/60)%60);
        var s =parseInt(left%60);
        document.getElementById('time').innerHTML = d + '天' + h + '小时' + m + '分钟' + s + '秒';
        if(left <= 0){
            document.getElementById('time').innerHTML = '团购结束';
        }
        setTimeout(showTime,1000);
    }
</script>

 

效果：