js之定时器使用

发布时间:2025-11-26 06:33

车载灭火器应定期检查并确保能正常使用,以备不时之需 #生活技巧# #驾驶安全技巧# #车载安全设备使用#

定时器的常见方法

setInterval():循环调用。将一段代码,每隔一段时间执行一次。(循环执行) setTimeout():延时调用。将一段代码,等待一段时间之后再执行。(只执行一次)

备注:在实际开发中,二者是可以根据需要,互相替代的。

setInterval() 的使用

setInterval():循环调用。将一段代码,每隔一段时间执行一次。(循环执行)

参数

参数1:回调函数,该函数会每隔一段时间被调用一次。 参数2:每次调用的间隔时间,单位是毫秒。

返回值:返回一个Number类型的数据。这个数字用来作为定时器的唯一标识,方便用来清除定时器。

定义定时器

方式一: 匿名函数

每间隔一秒,将 数字 加1:

   let num = 1;   setInterval(function () {       num ++;       console.log(num);   }, 1000);

方式二:

每间隔一秒,将 数字 加1:

   setInterval(fn,1000); ​       num ++;       console.log(num);   } ​

清除定时器

定时器的返回值是作为这个定时器的唯一标识,可以用来清除定时器。具体方法是:假设定时器setInterval()的返回值是参数1,那么clearInterval(参数1)就可以清除定时器。

setTimeout()的道理是一样的。

代码举例:

<script>    let num = 1; ​    const timer = setInterval(function () {        console.log(num);  //每间隔一秒,打印一次num的值        num ++;        if(num === 5) {  //打印四次之后,就清除定时器            clearInterval(timer);       } ​   }, 1000); </script> ​

setTimeout() 的使用

setTimeout():延时调用。将一段代码,等待一段时间之后再执行。(只执行一次)

参数

参数1:回调函数,该函数会每隔一段时间被调用一次。 参数2:每次调用的间隔时间,单位是毫秒。

返回值:返回一个Number类型的数据。这个数字用来作为定时器的唯一标识,方便用来清除定时器。

定义和清除定时器

代码举例:

   const timer = setTimeout(function() {        console.log(1); // 3秒之后,再执行这段代码。   }, 3000); ​    clearTimeout(timer); ​

代码举例:(箭头函数写法)

   setTimeout(() => {        console.log(1); // 3秒之后,再执行这段代码。   }, 3000);

setTimeout() 举例:5秒后关闭网页两侧的广告栏

假设网页两侧的广告栏为两个img标签,它们的样式为:

<style>   ...   ... ​ </style> ​

5秒后关闭广告栏的js代码为:

   <script>        window.onload = function () {            //获取相关元素            var imgArr = document.getElementsByTagName("img");            //设置定时器:5秒后关闭两侧的广告栏            setTimeout(fn,5000);            function fn(){                imgArr[0].style.display = "none";                imgArr[1].style.display = "none";           }       }    </script>

\

标签:

1

评论

收藏

关注

网址:js之定时器使用 https://klqsh.com/news/view/290775

相关内容

js 定时器
js定时器如何实现循环运行
js设置定时循环执行某任务
javascript 按时间循环、js指定循环次数
js 怎么获取腾讯qq分享
如何正确使用家用电器?使用时要注意哪些问题?
家居生活之家用电器使用五须知
火狐浏览器网页版入口下载
如何使用家用电器?这类电器的使用方法有哪些?
家用电器怎么使用 家用电器正确使用方法【详解】

随便看看