Date时间和定时器(异步代码）：

憨憨404

已于 2022-12-07 23:28:36 修改

阅读量178

点赞数

分类专栏： JS基础文章标签： javascript 开发语言

于 2022-12-07 19:07:04 首次发布

本文链接：https://blog.csdn.net/qq_60839348/article/details/128223217

版权

JS基础专栏收录该内容

14 篇文章 0 订阅

订阅专栏

时间差：

    <script>
        // 求时间差
        var d1 = new Date('2023-12-8 12:11:24')
        var d2 = new Date()
        console.log(d1-d2);
    </script>

Data时间：自动获取

    <script>
        /* 
            认识单词:
                get:获取  set:设置
                year:年  month:月  date:日期
                hours:小时  minutes:分钟  seconds:秒  millseconds:毫秒
                time:时间  day:天数
            单独获取某一个值的方式:
                获取年份:时间对象.getFullYear()
                获取月份:时间对象.getMonth(),0表示1月
                获取日期:时间对象.getDate()
                获取小时:时间对象.getHours()
                获取分钟:时间对象.getMinutes()
                获取秒:时间对象.getSeconds()
                获取星期:时间对象.getDay()===0表示星期天  1表示星期一
                时间对象.getTime()====得到时间戳(从1970年1月1日 0时0分0秒到现在的时间差,结果是毫秒值)
            单独设置某一个值:
                语法同上,把get换成set即可
                比如:时间对象.setFullYear()===设置年份


        */
            // 自动获取时间
        function AutoGetTime() {
            var d = new Date()

            // 年月日
            var year = d.getFullYear()
            var month = d.getMonth() + 1      // 0~11 表示 1月到12月
            var date = d.getDate()

            // 小时、分钟、
            var hour = d.getHours()
            var minute = d.getMinutes()
            var second = d.getSeconds()
            second = second < 10 ? '0' + second : second  //判断小于10，前边会拼接一个0，否则会默认输出

            var day = d.getDay()    // 0~6 表示 星期一到星期天 
            var dayArr = ['星期天', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六',]

            // dayArr[da]:数组[下标]得到数组数据
            console.log(`${year}年${month}月${date}日    ${hour}:${minute}:${second}    ${dayArr[day]}`)
        }
        AutoGetTime()
        AutoGetTime()
        AutoGetTime()
        



    </script>

定时器：

开启

setTimeout() ，setInterval()

关闭

clearTimeout()，setInterval()

<body>
    <button id="btn1">点我关闭定时器</button>

    <!-- /* 
    定时器其实就是让代码延迟执行的一种手段.
    开启定时器:
        1.延迟定时器,(延迟多长时间才执行代码)
            语法:setTimeout(函数,时间)
            延迟多长时间执行该函数.
        2.间隔定时器(循环定时器)(每间隔一段时间就执行一次代码) 
            语法:setInterval(函数,时间)
            每间隔多长时间就执行一次函数
        注意:时间是不带单位的,你写的那个数字是毫秒值
    定时器的返回值是一个数字,该数字表示你是页面中的第几个定时器,返回1就代表是第一个定时器.
*/  -->
    <script>

        // 开启定时器
        // 返回值：是一个数字，该数字表示是页面上第几个定时器

        // // 延迟定时器
        // setTimeout(function () {
        //     console.log('两秒后了，我执行了');          
        // },2000)
        // // 间隔（循环）定时器
        // setInterval(function () {
        //     console.log('我会两秒执行一次')
        // },2000)



        // 停止定时器
        // 
        var res1 = setInterval(function () {
            console.log('我会两秒执行一次')
        },2000)

        var btn1Ele = document.getElementById('btn1')
        btn1Ele.onclick = function () {
            // 停止定时器
            clearTimeout(res1)
            clearInterval(res1)
        }


        // eg：利用定时器一秒输出一次num的值
            // var num = 10
            // var res = setInterval(function(){
            //     num--
            //     console.log(num);
            //     if (num == 1) {
            //         clearInterval(res)
            //     }
            // },1000)
        
        // 代码执行顺序分二类：
        /* 
                同步代码：不做特别说明，全是同步代码
                            自上而下执行依次运行
                异步代码：定时器
                            先等所有的同步代码执行完毕，才会执行异步代码
        */


    </script>
</body>