关于定时器的那些事!

定时器有两种方法,分别是setInterval和setTimeout

一、创建定时器:setInterval() - 每隔指定的毫秒数不停地执行指定的代码。

语法:setInterval(code,time);

参数说明:

    code为每隔指定的毫秒数要执行的函数或js代码

    time是指定的毫秒数

实例:动态时钟

   <div id="clock"></div>

   setInterval(function(){

     var today = new Date();

     t = today.toLocaleTimeString();

      document.getElementById("clock").innerHTML = t;

   },1000);

二、清除定时器: clearInterval() -停止 setInterval() 方法执行的函数代码

  要使用 clearInterval() 方法, 在创建计时方法时必须使用全局变量:

  myClock = setInterval(fn,time);

  clearInterval(myClock);

三、创建超时器 setTimeout() - 指定的毫秒数后执行指定的代码

语法:setTimeout(code,time)

参数说明:code:指定毫秒数后要执行的函数或js代码

     time:指定毫秒数

注:如果setTimeout也可实现setInterval的效果(不常用)

  <script type="text/javascript">
    var t=0;
    function timer(){
      document.getElementById("txt").value=t;
      t++;
      setTimeout("timer()",1000);
    }
  </script>
  <body>
    <p>setTimeout实现计时器效果</p>
    <input type="text"id="txt">
  <script>
    timer();
  </script>
  </body>

实例:3秒后页面跳转到百度首页

    setTimeout(function(){

      location.href = "https://www.baidu.com";

    },3000);

四、清除超时器 clearTimeout() - 停止 setTimeout() 方法执行的函数代码

  要使用 clearTimeout() 方法, 在创建超时方法时必须使用全局变量:

  myTime = setTimeout(fn,time);

  clearTimeout(myTime);

五、setInterval()和setTimeout的区别

前者会不停的循环执行,而后者只会执行一次

时间: 2024-08-02 15:26:41

关于定时器的那些事!的相关文章

Javascript定时器学习笔记

掌握定时器工作原理必知:JavaScript引擎是单线程运行的,浏览器无论在什么时候都只且只有一个线程在运行JavaScript程序. 常言道:setTimeout和setInterval是伪线程. Javascript是运行在单线程环境中的,在页面的声明周期中,不同时间可能有其他代码在控制Javascript进程,比如:包含在<script>元素中的代码.dom元素的事件处理程序.Ajax的回调函数.定时器仅仅是在未来的某个时刻将代码添加到代码队列中,执行时机是不能保证的.代码队列按照先进先

第八章—BOM(一)

ECMAscript是JS的核心,而要在web上使用JS,那么BOM无疑是真正的核心.BOM叫浏览器对象模型,它 提供了许多对象,用于访问浏览器的功能. BOM的核心对象是window,它表示浏览器的一个实例.在浏览器中,它有双重角色,它既是通过JS访问浏览器 的一个接口,又是ESMAScript规定的global对象. 1.全局作用域 在全局作用域中声明的变量,函数都会成为window对象的属性和方法.这里有一个小知识点:定义全局变量和 在window对象上直接定义属性还是有点区别,全局变量不

DOM 4

1. ***HTML DOM常用对象: Form 2. BOM 1. ***HTML DOM常用对象: Form: 代表一个<form元素 获取: var form=document.forms[i/id/name]; 属性: .length: 相当于form.elements.length 方法: .submit() : 专用于手动提交表单 问题: 用户可能按回车,自动提交 解决: 表单提交的最后一关是一个事件 form.onsubmit(): 当表单正式提交前自动触发 获取*表单*元素: v

for循环,定时器,闭包混合一块的那点事。

1,对于一个基本的for循环,顺序输出变量值. for(var i = 1; i < 4; i++){ console.log(i);//结果不多说了吧 } 2,如果for循环中有定时器,如下代码. for (var i = 1; i < 4; i++) { setTimeout(function() { console.log(i);//3个4 }, 3000); } 初衷想要3s后输出1,2,3.但是3s后,输出3个4.原因是定时器的异步执行,for循环的执行速度很快,当真正执行到函数体时

Android零基础入门第60节:日历视图CalendarView和定时器Chronometer

原文:Android零基础入门第60节:日历视图CalendarView和定时器Chronometer 上一期学习了AnalogClock.DigitalClock和TextClock时钟组件,本期继续来学习日历视图CalendarView和定时器Chronometer. 一.CalendarView 日历视图(CalendarView)可用于显示和选择日期,用户既可选择一个日期,也可通过触 摸来滚动日历.如果希望监控该组件的日期改变,则可调用CalendarView的 setOnDateCha

关于JS中的定时器!!!

定时器: 周期性定时器 一次性定时器 1. 周期性定时器: 让程序每隔一段时间间隔,反复执行一项任务 何时使用: 只要连续,有规律的持续播放的动画 如何使用: 3件事: 1. ***任务函数: 定时器每次执行的任务 function task(){...} 任务函数通常要自己考虑:*何时停止*定时器的临界值 2. 将任务函数放入定时器,定时执行: timer=setInterval(task,interval) 其中: interval 是间隔的毫秒数 timer往往是一个全局变量: 用来保存当

你不知道的JavaScript--Item23 定时器的合理使用

1.定时器概述 window对象提供了两个方法来实现定时器的效果,分别是window.setTimeout()和window.setInterval.其中前者可以使一段代码在指定时间后运行:而后者则可以使一段代码每过指定时间就运行一次.它们的原型如下: window.setTimeout(expression,milliseconds); window.setInterval(expression,milliseconds); 其中,expression可以是用引号括起来的一段代码,也可以是一个

quick-cocos2d-x学习笔记—定时器

定时器用的地方还是比较多的,游戏中的逻辑判断很多都是采用每帧执行.quick对于schedule的封装在scheduler这个lua文件中.如果是第一次接触quick的话,可能按照官方的api来写一个定时器被报错,提示schedule是一个nil值,这是因为其他的模块在初始化时都是被加载的,唯独这个scheduler没有载入,所以在使用的时候,第一件事是引入这个模块, [html] view plain copy local scheduler = require("framework.sche

【转】Android 定时器实现的几种方式和removeCallbacks失效问题详解--不错

原文网址:http://blog.csdn.net/xiaanming/article/details/9011193 实现定时器有很多种方式,在这里我简单的介绍几种方式 (1)使用Handler + Runnable的方式 [java] view plaincopy Handler handler = new Handler(); Runnable runnable = new Runnable() { @Override public void run() { //你要做的事 //.....