首页 > 其他分享> > 95JS原生：现在时间和倒计时
95JS原生：现在时间和倒计时

2019-06-03 14:02:44 作者：互联网
1、现在时间
```html:run
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>北京时间</title>
    <style>
        * {
            margin: 0;
            padding: 0;
        }
        p {
            font-size: 70px;
            text-align: center;
            font-family: 宋体;
        }
        p span {
            display: block;
            color: black;
            float:left;
        }
        p#math {
            color: red;
            height: 80px;
            width:990px;
            margin:0 auto;
        }
        p#math div {
            text-align: center;
            width: 40px;
            height: 80px;
            line-height: 80px;
            float: left;
            font-family: UniDreamLED;
        }
        img{
            display: block;
            margin: 0 auto;
        }
    </style>
</head>
<body>
<p id="char">北京时间,现在是：</p>
<p id="math"></p>
<script>
    var math = document.getElementById('math');
    function tow(n) {
        var str1="";
        n = n >= 0 && n < 10 ? '0' + n : '' + n;
        for (var i = 0; i < n.length; i++) {
            var str2=n[i];
            str2="<div>"+str2+"</div>";
            str1+=str2;
        }
        return str1;
    }
    function getDate() {
        var nowDate = new Date();
        var year = nowDate.getFullYear();
        var month = nowDate.getMonth() + 1;
        var date = nowDate.getDate();
        var hour = nowDate.getHours();
        var minute = nowDate.getMinutes();
        var second = nowDate.getSeconds();
        var str = tow(year) + "<span>年</span>"
                + tow(month) + "<span>月</span>"
                + tow(date) + "<span>日</span>"
                + tow(hour) + "<span>时</span>"
                + tow(minute) + "<span>分</span>"
                + tow(second) + "<span>秒</span>";
        math.innerHTML = str;
    }
    getDate();
    setInterval(getDate, 1000);
</script>
</body>
</html>
```


2、倒计时：
```html:run
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <style>
        *{
            margin: 0;
            padding:0;
        }
        p {
            font-size: 95px;
            text-align: center;
        }

        p span {
            color: red;
        }

        p span.time {
            color: black
        }
    </style>
</head>
<body>
<p>距离2020年还有</p>
<p><span></span></p>
<script>
    var oSpan = document.getElementsByTagName('span')[0];
    function tow(n) {
        return n >= 0 && n < 10 ? '0' + n : '' + n;
    }
    function getDate() {
        var oDate = new Date();//获取现在日期对象
        var oldTime = oDate.getTime();//现在距离1970年的毫秒数
        var newDate = new Date('2020/1/1 00:00:00');//获取指定日期对象
        var newTime = newDate.getTime();//2020年距离1970年的毫秒数
        var second = Math.floor((newTime - oldTime) / 1000);//未来时间距离现在的秒数
        var day = Math.floor(second / 86400);//整数部分代表的是天；一天有24*60*60=86400秒 ；
        second = second % 86400;//余数代表剩下的秒数；
        var hour = Math.floor(second / 3600);//整数部分代表小时；
        second %= 3600; //余数代表 剩下的秒数；
        var minute = Math.floor(second / 60);
        second %= 60;
        var str = tow(day) + '<span class="time">天</span>'
                + tow(hour) + '<span class="time">小时</span>'
                + tow(minute) + '<span class="time">分钟</span>'
                + tow(second) + '<span class="time">秒</span>';
        oSpan.innerHTML = str;
    }
    getDate();
    setInterval(getDate, 1000);
</script>
</body>
</html>
```
标签：原生,95JS,tow,倒计时,second,nowDate,var,math,getDate
来源： https://www.cnblogs.com/gushixianqiancheng/p/10967185.html