1. 首先注意,setIntervalclearInterval都是直属于window对象的。

1、直接调用setInterval(即不通过函数调用)

  1. <div id="oDiv_showCurrTime0" style="border:1px solid black; height:20px;"></div>
  2. <script>
  3. var dT = document.getElementById("oDiv_showCurrTime0");
  4. //var inX = setInterval("funX()",1000);
  5. var inX = setInterval(funX,1000); //setInerval直接使用时,这两种方法都可以
  6. function funX(){
  7. var dTime = new Date();
  8. dT.innerHTML = dTime.toLocaleTimeString()
  9. }
  10. </script>

2、函数调用setInterval和clearnterval

  1. <div id="oDiv_showCurrTime" style="border:1px solid black; height:20px;"></div><button onclick="startX()">开始</button><button onclick="stopX()">停止</button>
  2. <script>
  3. var intX; //这个必须写在startX函数外或不写,stopX才有效。
  4. function startX(){
  5. intX= setInterval(func,500) //通过函数调用setInterval时,第一个参数不可以用"func()"这种形式,只能直接用函数名
  6. var dT = document.getElementById("oDiv_showCurrTime");
  7. function func(){
  8. var dTime = new Date();
  9. dT.innerHTML = dTime.toLocaleTimeString()
  10. }
  11. }
  12. function stopX(){
  13. window.clearInterval(intX) //注意!如果var intX定义在startX内,则无法清除!
  14. }
  15. </script>

  3、函数调用带有参数的setInterval

  1. <div id="oDiv_showCurrTime" style="border:1px solid black; height:20px;"></div><button onclick="startX()">开始</button><button onclick="stopX()">停止</button>
  2. <script>
  3. var intX; //这个必须不写或者写在startX函数外,stopX才有效。
  4. var arr = new Array;
  5. arr[0]="rrr"
  6. function startX(){
  7. //intX= setInterval(func("rrr"),500) 这种方法是错误的。如果需要调用带参数的函数,直接使用func("rrr")会在第一次加载后,提示参数无效
  8. intX= setInterval(function(){func.apply(this,arr)},500) //apply参数问题请查资料
  9. function func(a){
  10. var dT = document.getElementById("oDiv_showCurrTime");
  11. var dTime = new Date();
  12. dT.innerHTML = a + dTime.toLocaleTimeString()
  13. }
  14. }
  15. function stopX(){
  16. window.clearInterval(intX) //注意!如果var intX定义在startX内,则无法清除!
  17. }
  18. </script>
  19.  
  20.   

  

setInterval 与 clearInterval详解的更多相关文章

  1. setTimeout和setInterval定时器使用详解测试

    var len=4; while(len--){ var time=setTimeout(function(){ console.log(len); },0); console.log(time); ...

  2. 新手入门:史上最全Web端即时通讯技术原理详解

    前言 有关IM(InstantMessaging)聊天应用(如:微信,QQ).消息推送技术(如:现今移动端APP标配的消息推送模块)等即时通讯应用场景下,大多数都是桌面应用程序或者native应用较为 ...

  3. Web端即时通讯技术原理详解

    前言 有关IM(InstantMessaging)聊天应用(如:微信,QQ).消息推送技术(如:现今移动端APP标配的消息推送模块)等即时通讯应用场景下,大多数都是桌面应用程序或者native应用较为 ...

  4. js实现的新闻列表垂直滚动实现详解

    js实现的新闻列表垂直滚动实现详解:新闻列表垂直滚动效果在大量的网站都有应用,有点自然是不言而喻的,首先由于网页的空间有限,使用滚动代码可以使用最小的空间提供更多的信息量,还有让网页有了动态的效果,更 ...

  5. Observable详解

    Observable详解 rxjs angular2 在介绍 Observable 之前,我们要先了解两个设计模式: Observer Pattern - (观察者模式) Iterator Patte ...

  6. Day04 dom详解及js事件

    day04 dom详解 DOM的基础 Document对象 Element对象 Node对象 innerHTML 事件处理 表单验证   上次课内容回顾: JS中ECMAScript用法: JS定义变 ...

  7. Day03 javascript详解

    day03 js 详解 JavaScript的基础 JavaScript的变量 JavaScript的数据类型 JavaScript的语句 JavaScript的数组 JavaScript的函数 Ja ...

  8. 关于setTimeout()你所不知道的地方,详解setTimeout()

    关于setTimeout()你所不知道的地方,详解setTimeout() 前言:看了这篇文章,1.注意setTimeout引用的是全部变量还是局部变量了,当直接调用外部函数方法时,实际上函数内部的变 ...

  9. 【Python全栈-JavaScript】JavaScript-字符串详解

    JavaScript-字符串详解 预热:Number() 方法 <script> //重要等级 1,2,3,4,5 var s=10; //最高级别5 var s1=new Number( ...

随机推荐

  1. Python环境安装与升级

    Python是跨平台的,它可以运行在Windows,Mac,Linux/Unix系统上,在Windows上写的Python程序,在Linux上也是能够运行的.目前,Python有两个大版本,一个是2. ...

  2. php中模拟post,get请求和接受请求详细讲解

    在php中我们经常用到curl拓展来进行模拟post.get请求,下面就来具体说说怎么模拟: 一.首先模拟post请求: function http_post_data($url, $query_da ...

  3. curl命令上传下载文件

    下载单个文件,默认将输出打印到标准输出中(STDOUT)中 curl http://www.centos.org 通过-o/-O选项保存下载的文件到指定的文件中: -o:将文件保存为命令行中指定的文件 ...

  4. 微信智能机器人助手,基于hook技术,自动聊天机器人

    下载地址: 链接:https://pan.baidu.com/s/1N5uQ3gaG2IZu7f6EGUmBxA 提取码:md7z 复制这段内容后打开百度网盘手机App,操作更方便哦 微信智能助手说明 ...

  5. [原创] Laravel 启动流程

    目录 1. 程序启动准备 1.1 容器基础配置 1.2 核心类绑定 1.3 实例化 Http 核心类 2. 请求实例化 3. 请求处理 3.1 请求处理环境初始化 1. 环境监测 \Illuminat ...

  6. MySQL压缩版Windows环境进行安装配置

    MySQL下载地址:https://dev.mysql.com/downloads/mysql/ 选择对应的系统和相应的版本后点击Download进入下载页面,不需要登录,点击下面的“No thank ...

  7. pydicom读取dicom文件报错

    之前采用pydicom读取dicom文件一切都很正常,不过最近读取一批数据的时候,会报错 读取代码 file = pydicom.read_file(filepath) data = file.pix ...

  8. 高阶篇:4.1.2)QFDII(设计要求逐层分配给各零件)

    本章目的:明确QFDII的作用:输入为设计要求(Design Feature),输出为零件特征(Part Characteristic),将设计要求分配到每一个零件特征中去: 本章开始介绍产品结构设计 ...

  9. MyEclipse配置,每次打开server中都没有weblogic

    最近在myeclipse新配了个weblogic,结果每次打开myeclipse在server中都看不到weblogic,得重新去配置页面走一遭才能出现.很麻烦. 后来在网上找了找,找到一个办法: 在 ...

  10. Q467 环绕字符串中唯一的子字符串

    把字符串 s 看作是"abcdefghijklmnopqrstuvwxyz"的无限环绕字符串,所以 s 看起来是这样的:"...zabcdefghijklmnopqrst ...