• setInterval()-一旦被开启就会不断的执行,使用clearInterval()清除后将不再执行
  • setTimeout()-又称为一次定时器,定时器开启后只执行一次将不会接着执行,使用clearTimeout()清除后一次也不会执行定时器里面的内容
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
*{
padding: 0;
margin: 0;
}
body{
text-align: center;
}
#btn1,#btn2{
margin-top: 100px;
}
</style>
</head>
<body>
<button id="btn1">执行多次</button>
<button id="btn2">执行一次</button>
<script>
var btn1=document.getElementById("btn1");
var btn2=document.getElementById("btn2");
var timers=null;
var timer=null;
//监听按钮点击事件
btn1.onclick=function(){
//清除定时器
 clearInterval(timers);
//开启定时器
timers=setInterval(function(){
var num=parseInt(Math.random()*3);
console.log(num);
},3000);
}
btn2.onclick=function(){
//清除定时器
clearTimeout(timer);
timer=setTimeout(function(){
alert("我是一次定时器");
},2000);
}
</script>
</body>
</html>

setInterval()与setTimeout()的区别的更多相关文章

  1. setInterval与setTimeout的区别

    在制作网页动态效果时,一定会遇到某些需求,要求某段程序等待多时时间后再开始执行,就像在我们的生活中一样,待会儿再开始做一件事.在JavaScript中主要通过定时器实现此类需求,本文将对定时器做一个概 ...

  2. 第46天:setInterval与setTimeout的区别

    js的setTimeout方法用处比较多,通常用在页面刷新了.延迟执行了等等.今天对js的setTimeout方法做一个系统地总结. setInterval与setTimeout的区别 说道setTi ...

  3. val();html();.text()区别 setInterval与setTimeout的区别

    val();html();.text()区别   对于innerHTML 属性,几乎所有的元素都有innerHTML属性,它是一个字符串,用来设置或获取位于对象起始和结束标签内的HTML.(获取HTM ...

  4. setInterval和setTimeout的区别以及setInterval越来越快问题的解决方法

    setInterval()和setTimeout()方法都是js原生的定时方法,当然它们两个的作用也是不同的,并且最近在做上下滚动公告栏的时候,发现了setInterval()非常令人抓狂的问题,那就 ...

  5. JS中setInterval与setTimeout的区别

    JS里设定延时: 使用SetInterval和设定延时函数setTimeout 很类似.setTimeout 运用在延迟一段时间,再进行某项操作. setTimeout("function& ...

  6. 【JavaScript】setinterval和setTimeout的区别

    计时器setTimeout()与setInterval()是原生JS很重要且用处很多的两个方法, 但很多人一直误以为是相同的功能: 间隔时间重复执行传入的句柄函数. 但实际上, 并非如此, 既然JS给 ...

  7. setInterval和setTimeout的区别

    setInterval会每隔指定的毫秒数后反复执行指定代码. setTimeout只会在指定的毫秒数后执行一次指定代码. setInterval的用法: // 创建(创建后即开始计时) var int ...

  8. setInterval()和setTimeout()的区别

    一.setInterval()函数的语法结构: setInterval(code,interval) setInterval()函数可周期性执行一段代码,也就是说代码会被周期性不断的执行下去. 函数具 ...

  9. setInterval与setTimeout 的区别

    setInterval在执行完一次代码之后,经过了那个固定的时间间隔,它还会自动重复执行代码,而setTimeout只执行一次那段代码     用法: setInterval("alert( ...

随机推荐

  1. Fair Candy Swap LT888

    Alice and Bob have candy bars of different sizes: A[i] is the size of the i-th bar of candy that Ali ...

  2. Flask 学习目录

    Flask 学习目录 Flask 的学习过程是一个了解如何从单个模块搭建一个 Web 框架的过程. Python.Flask 的安装和设置 简单的 Hello World 程序 使用 Jinjia2 ...

  3. Scrum冲刺阶段4

    成员今日完成的任务 人员 任务 何承华 学习后端设计 陈宇 后端设计 丁培辉 学习后端设计 温志铭 日程添加界面设计(一半) 杨宇潇 日程添加界面设计(一半) 张主强 服务器构建 成员遇到的问题 人员 ...

  4. Python Day 13 装饰器

    阅读目录   内容回顾 函数嵌套的定义 global.nonlocal关键字 闭包及闭包的运用场景 开放封闭原则 装饰器 一个函数被多次装饰 ##内容回顾 1.函数对象:函数名 => 存放的是函 ...

  5. requests+正则爬取猫眼电影前100

    最近复习功课,日常码农生活. import requests from requests.exceptions import RequestException import re import jso ...

  6. C++ Thrift服务端记录调用者IP和被调接口方法

    Apache开源的Thrift(http://thrift.apache.org)有着广泛的使用,有时候需要知道谁调用了指定的函数,比如在下线一起老的接口之前,需要确保对这些老接口的访问已全部迁移到新 ...

  7. 内存栅栏(memory barrier):解救peterson算法的应用陷阱

    最近一个项目中用到了peterson算法来做临界区的保护,简简单单的十几行代码,就能实现两个线程对临界区的无锁访问,确实很精炼.但是在这不是来分析peterson算法的,在实际应用中发现peterso ...

  8. IDEA引入spring的命名空间

    我们在写spring的配置文件的时候,有的时候可能会用到 P 标签,然后我们发现自己并没有p标签啊,那么我们一起来看我是怎么解决的. 首先在我们的xml文件的首部添上这句话: xmlns:contex ...

  9. [转] 分代垃圾回收的 新旧代引用问题(原标题:Back To Basics: Generational Garbage Collection)

    原文链接: https://blogs.msdn.microsoft.com/abhinaba/2009/03/02/back-to-basics-generational-garbage-colle ...

  10. Lesson 22 A glass envelope

    Text My daughter, Jane, never dreamed of receiving a letter from a girl of her own age in Holland. L ...