Date对象和Math函数——倒计时制作

最新推荐文章于 2021-02-27 03:26:34 发布

原创最新推荐文章于 2021-02-27 03:26:34 发布 · 468 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#js #Math #Date #倒计时

js 专栏收录该内容

15 篇文章

订阅专栏

本文介绍了如何利用JavaScript的Date对象和Math函数创建倒计时。首先讲解了Date对象的基本用法，包括获取年、月、日、星期、小时、分钟、秒和毫秒的方法。接着介绍了Math对象的常用函数，如开方、次方、取整、取绝对值、四舍五入和随机数生成。最后，文章提到了倒计时的应用，并给出了倒计时的线上展示地址。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

倒计时线上地址倒计时

date对象

Date 对象用于处理日期与时间。
创建 Date 对象： new Date()

var now =new Date();//拿到的是电脑的本机时间
var year=now.getFullYear();//获取年；
var month=now.getMonth();//获取月；跟正常的月差1；6代表7月
var date = now.getDate();//获取几号；
var day =now.getDay();//获取星期几；0——》日 1-》周一 2-》周二
var hour=now.getHours();//获取小时（24小时制）
var minutes =now.getMinutes();//获取分钟
var second = now.getSeconds();//获取秒
var miniSecond = now.getMilliseconds();//获取毫秒；

   var t =now.getTime();//获得当前时间距离1970-0-0  0：0：0 的毫秒数
    var oDiv=document.getElementById('div1')
    var now = new Date();
    var year = now.getFullYear();//年
    var month = now.getMonth()+1;//月
    var date = now.getDate();//几号
    var hour = now.getHours();//时
    var minute = now.getMinutes();//分
    var second =now.getMilliseconds();//秒

    var str = `今天是${year}年${month}月${date}日 ${hour}:${minute}:${second}` ;

Date 对象方法

在这里插入图片描述

Math函数

Math 对象用于执行数学任务。
Math 对象并不像 Date 和 String 那样是对象的类，因此没有构造函数 Math()。

Math.sqrt(4);//–> 开方运算
Math.pow(x,y);//x 的y 次方
Math.floor(2.9)// 2 向下取整作用等同于 parseInt(）正数；
Math.ceil(2.1)//2 向上取整作用等同于parseInt()负数
Math.abs(-2)//2 取绝对值
Math.abs(2)//2
Math.round()//四舍五入
Math.round(3.1);
Math.random()//取（0-1）的随机小数，包含0不包含1
Math.max();//取一组数中的最大值
Math.min();//取一组数的最小值

//求 0-50 之间的随机数  [0-50)
    Math.random()*50
    //求 0-50之间的随机整数
    math.floor(Math.random()*50);//[0-50)包含0 不包含50

    //求0-50 之间的随机整数[0-50]//双包含
    Math.round(Math.random()*50);
    //求0-50的随机整数[0-50]
    Math.ceil(Math.random()*50);//[0-50]
    //5-50之间的随机整数
    Math.round(Math.random()*45+5);//0-50  [0-45]+5
    //求[m-n]之间的随机整数
    Math.round(Math.random()*(n-m)+m)
    //获取一个验证码 四位英文或者数字组成的字符串
    //思路 需要一个类似与字典的东西，我们要从这个字典里边获取咱们要的字符；
    //有字典之后  我们需要有一个与之对应的查询关键词
    var str='qwertyuiopasdfghjklmnbvcxzQWERTYUIOPASDFGHJKLMNBVCXZ012345789'
    //怎么能拿到里边某个字符  str[9]
    //'we23' '2weff' 'qwer'
    //接下来 去拿四个随机的索引  四个随机的数字[0-61的范围]
   var n= Math.round(Math.random()*61);//[0-61]之间的随机整数；
[o.type(0  )]
    function getStr(){
        for (var i = 0; i < 4; i++) {
            var n =Math.round(Math.random()*61);
            str1+=str[n];
        }
       return str1;
    }

倒计时

倒计时线上地址倒计时

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>珠峰培训</title>
    <style>
        #div1{
            display: table;
            font-size: 20px;
            border: 1px solid black;
            background: rgba(0,0,0,.5);
            color: #ffff;
            padding: 20px;
        }
    </style>
</head>
<body>
    <div id="div1">倒计时开始</div>
</body>
</html>
<script>
    var tar = new Date('2119/7/22 18:00:00').getTime();
    // tar 是目标时间 距离 1970 年的 毫秒数

    var now = new Date().getTime();
    //now  是当前时间距离 1970  年的 毫秒数

    var time = tar - now;
    // time  当前时间 距离 目标时间的 毫秒数；

    // 接下来 我们要把这个毫秒数 转成 咱们能看的 时分秒
    // 1h --->  60*60*1000 毫秒
    // 1m --->  60*1000 毫秒
    // 1s ---> 1000  毫秒

    // time中 有几个整小时
    var h = Math.floor(time/3600000);

    //time 现在是 刨去整数个小时之后剩余的好秒数
    time = time - h*3600000;

    // 剩余time中有多少整数个 分钟
    var m = Math.floor(time/60000);

    //time 是刨去 整数分钟后剩余的 毫秒数
    time = time - m*60000;

    var s = Math.floor(time/1000);

    var str = `距离下课还有${h}小时${m}分钟${s}秒`;

    var oDiv = document.getElementById('div1');
    // oDiv.innerText = str;
    // oDiv.innerHTML = str;

    function timeCount() {
        var tar = new Date('2118/7/22 18:30:00').getTime();
        var now = new Date().getTime();
        var time = tar - now;
        if(time <= 0){
            clearInterval(timer2);
            time = 0;
        }
        var y =Math.floor(time/31536000000);
        time = time-y*31536000000;
        var d=Math.floor(time/86400000);
        time = time-d*86400000;
        var h = Math.floor(time/3600000);
        time = time - h*3600000;
        var m = Math.floor(time/60000);
        time = time - m*60000;
        var s = Math.floor(time/1000);
        var str = `距离【2118/7/22 18:30:00】还有${y<10?'0'+y:y}年${d<10?'0'+d:d}天${h<10?'0'+h:h}小时${m<10?'0'+m:m}分钟${s<10?'0'+s:s}秒`;
        var oDiv = document.getElementById('div1');
        oDiv.innerText = str;
    }

    //定时器
    // setTimeout(f,time); 到达指定时间之后 执行一次 函数体
    // setInterval(f,time);每隔time时间 执行一次 函数体
    // var timer = setTimeout(function () {
    //     timeCount()
    // },3000);
    var timer2 = setInterval(function () {
        timeCount();
    },1000);
    // clear   clearTimeout(timer)  clearInterval(timer2)
    oDiv.onclick = function () {
        // clearInterval(timer2)
    }

</script>