js倒计时

牛犊

于 2018-01-12 13:46:21 发布

阅读量161

点赞数

分类专栏：前端

本文链接：https://blog.csdn.net/need_just_word/article/details/79043145

版权

前端专栏收录该内容

5 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>倒计时</title>
</head>
<script>
window.onload = function() {
    //显示当前时间
    var weekday = new Array(7);
    weekday[0] = '星期日';
    weekday[1] = '星期一';
    weekday[2] = '星期二';
    weekday[3] = '星期三';
    weekday[4] = '星期四';
    weekday[5] = '星期五';
    weekday[6] = '星期六';
    setInterval(function() {
                var text = document.getElementById('time');
                var mydate = new Date();
                var year = mydate.getFullYear();
                var month = mydate.getMonth()+1;
                var date = mydate.getDate();
                var hour = mydate.getHours();
                var minute = mydate.getMinutes();
                var second = mydate.getSeconds();
                var day = mydate.getDay();


                hour = checkText(hour);
                minute = checkText(minute);
                second = checkText(second);
                text.innerHTML = year + '年' + month + '月' + date + '日 ' + hour + ':' + minute + ':' + second + ' ' + weekday[day];
            }
   ,500);

    //倒计时
    var timer = null;
    timer = setInterval(daoJiShi,500);
}

function daoJiShi(){
    var target = new Date(2018,6,7);
    var now = new Date();
    var leftTime = target - now;
    if(leftTime <= 0){
        clearInterval(timer);
    }
    var day = Math.ceil(leftTime / (1000*60*60*24));
    var hour = Math.ceil(leftTime / (1000*60*60) % 24);
    var minute = Math.ceil(leftTime / (1000*60) % 60);
    var second = Math.ceil(leftTime / (1000) % 60);
    var dao = document.getElementById('update');
    dao.innerHTML = '倒计时：距离2018年高考，' + '还剩' + day + '天' + hour + '小时' + checkText(minute) + '分' + checkText(second) + '秒';
}

//不足两位的补前面补一个零
function checkText(i){
    if(i < 10){
        i = '0' + i;
    }
    return i;
}
</script>
<body>
    <p id="time">时间：</p>
    <p id="update">倒计时</p>
</body>
</html>

牛犊

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
js倒计时

html lang="en">head> meta charset="UTF-8"> title>倒计时title>head>script>window.onload = function() { //显示当前时间 var weekday = new Array(7); weekday[0] = '星期日'; weekday[1] = '星期
复制链接

扫一扫

专栏目录