WebAPI-window对象的两个定时器

WebAPI 专栏收录该内容
26 篇文章 0 订阅

window 对象的两个定时器

setTimeout()

setTimeout(function|code, milliseconds, param1, param2, ...) 在指定的毫秒数后会调用函数或计算表达式,只会调用一次;返回值为定时器 ID(数字类型)。

参数:

  • function|code 定时器调用的回调函数(可以是匿名函数也可以是命名函数的函数名)或JS代码串(如果JS代码串是函数名则需要加小括号调用,例如:'fun()';这种方式不推荐使用)
  • milliseconds 毫秒值,省略该参数时默认值为 0
  • param1, param2, ... 用于传给回调函数的参数(IE9 以上才支持该参数)

示例:

// 1000 毫秒后会弹出一个警告框
setTimeout(function() {
	alert('执行了回调函数!')
}, 1000)

在这里插入图片描述

setInterval()

setInterval(function|code, milliseconds, param1, param2, ...) 按照指定的周期(时间以毫秒计)不停的来调用函数或计算表达式,直到使用 clearInterval() 清除了定时器或关闭了浏览器窗口;返回值为定时器 ID。

参数同 setTimeout()

示例:

function kuang() {
	console.log('打印!')
}
// 每隔 1000 毫秒就会在控制台打印信息
setInterval(kuang, 1000)

在这里插入图片描述
补充:使用 setTimeout()setInterval() 时可以省略 window 前缀。

清除定时器的两种方法

clearTimeout()

clearTimeout(timeoutID) 用于清除通过 setTimeout() 创建的定时器

  • timeoutID 由 setTimeout() 返回的 ID 值,必要的参数
<button id="btn">停止</button>
<script>
  var btn = document.querySelector('#btn')

  // 添加点击事件
  btn.addEventListener('click', function() {
    // 清除定时器
    clearTimeout(timer)
  })

  // 用来存储定时器 id
  var timer = null

  function show() {
    // 存储定时器 id
    timer = setTimeout(function() {
      console.log('打印!')
      // 调用 show 函数
      show()
    }, 1000)
  }
  // 调用 show 函数
  show()
</script>

在这里插入图片描述

clearInterval()

clearInterval(intervalID) 方法可清除 setInterval() 方法创建的定时器

  • intervalID 由 setInterval() 返回的 ID 值,必要的参数
  • 0
    点赞
  • 0
    评论
  • 0
    收藏
  • 一键三连
    一键三连
  • 扫一扫,分享海报

©️2021 CSDN 皮肤主题: 书香水墨 设计师:CSDN官方博客 返回首页
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值