在JS中的定时器分两种:

  1,setTimeout()

  2,setInterval()

setTimeout():

  只在指定时间后执行一次:

function hello(){
alert('hello');
}
// 使用方法名字执行方法
var t1 = window.setTimeout(hello,1000);
//一般第一个元素写入函数名
var t2 = window.setTimeout("hello()",3000) // 使用字符串执行方法
window.clearTimeout(t1); // 去掉定时器。

setInterval():

  在指定时间为周期循环执行:

<script type="text/javascript">
window.onload = function(){
var oapp = document.getElementById('app');
var movebtn = document.getElementById('move');
var count = 0;
var timer = null;
movebtn.onclick = function(){
timer = setInterval(function(){
count += 3;
if(count>=500){
clearInterval();
}
oapp.style.marginLeft = count + 'px';},50);
}
}
</script>
</head>
<body>
<div id="app" style="width:100px;height: 100px;border:1px solid red"></div>
<button id ='move'>移动</button>
</body>

对于这两个方法,需要注意的是如果要求在每隔一个固定的时间间隔后就精确地执行某动作,那么最好使用setInterval,而如果不想由于连续调用产生互相干扰的问题,尤其是每次函数的调用需要繁重的计算以及很长的处理时间,那么最好使用setTimeout。

JS中的定时器的更多相关文章

  1. js 中的定时器

    在js中的定时器分两种:1.setTimeout() 2.setInterval() 1.setTimeOut() 只在指定时间后执行一次 /定时器 异步运行 function hello(){ al ...

  2. 解决在JS中阻止定时器“重复”开启问题、Vue中定时器的使用

    1.问题描述 在一些需求开发中.需要设定软件提供服务的时间段(营业时间).这时可以选择定时器来实现.可以选择让定时器每隔一段时间检测当前时间是否在服务时间.到达服务时间.进入服务状态.未到服务时间.进 ...

  3. 关于js中两种定时器的设置及清除

    1.JS中的定时器有两种: window.setTimeout([function],[interval]) 设置一个定时器,并且设定了一个等待的时间[interval],当到达时间后,执行对应的方法 ...

  4. 关于js中两种定时器的设置及清除(转载)

    1.JS中的定时器有两种: window.setTimeout([function],[interval]) 设置一个定时器,并且设定了一个等待的时间[interval],当到达时间后,执行对应的方法 ...

  5. python 全栈开发,Day52(关于DOM操作的相关案例,JS中的面向对象,定时器,BOM,client、offset、scroll系列)

    昨日作业讲解: 京东购物车 京东购物车效果: 实现原理: 用2个盒子,就可以完整效果. 先让上面的小盒子向下移动1px,此时就出现了压盖效果.小盒子设置z-index压盖大盒子,将小盒子的下边框去掉, ...

  6. JavaScript基础(3)-JS中的面向对象、定时器、BOM、位置信息

    一.创建对象的几种常用方式. 1.使用Object或对象字面量创建对象: a.使用Object()内置的构造函数来创建对象,例如: var student = new Object(); // 创建一 ...

  7. 前端JavaScript(3)-关于DOM操作的相关案例,JS中的面向对象、定时器、BOM、位置信息

    小例子: 京东购物车 京东购物车效果: 实现原理: 用2个盒子,就可以完整效果. 先让上面的小盒子向下移动1px,此时就出现了压盖效果.小盒子设置z-index压盖大盒子,将小盒子的下边框去掉,就可以 ...

  8. js中定时器调用函数时为什么会有引号

    之前在学习的时候并没有发现的细节,关于js中,定时器的问题 这里我们写两个延时器 setTimeout(func, 0); setTimeout("func()", 0);定时器中 ...

  9. 关于js中this指向的理解总结!

    关于js中this指向的理解! this是什么?定义:this是包含它的函数作为方法被调用时所属的对象. 首先,this的指向在函数定义的时候是确定不了的,只有函数执行的时候才能确定this到底指向谁 ...

随机推荐

  1. Vim技能修炼教程(11) - 代码折叠

    上一讲我们是程序员篇的第一讲,关于代码跳转.代码跳转是一个付出很少收获很大的功能.这一节我们开始一个收获很多,但是付出也相对多一点功能:代码折叠. 代码折叠 折叠的类型 折叠有下面几种类型: * Ma ...

  2. event.preventDefault() 解决按钮多次点击 导致页面变大

    event.preventDefault() 解决按钮多次点击 导致页面变大

  3. C#中PadLeft和PadRight小知识点

    当我们显示字符串数据时,有时候我们需要考虑数据的排列美观. 比如一些人名和一些编号,我们想让他们整齐对齐显示等. C# String类提供了2种操作方法: String.PadLeft(int tot ...

  4. spring boot入门教程——Spring Boot快速入门指南

    Spring Boot已成为当今最流行的微服务开发框架,本文是如何使用Spring Boot快速开始Web微服务开发的指南,我们将使创建一个可运行的包含内嵌Web容器(默认使用的是Tomcat)的可运 ...

  5. postfix邮件服务器搭建01-准备篇

    本系列文章主要介绍linux下主流的开源邮件系统postfix的搭建过程,构建一个通过postfix虚拟用户管理的完整的邮件系统, 该系统包括以下组件: 邮件收发端postfix,dovecot, 邮 ...

  6. 【剑指offer】数组中出现次数超过数组长度一半的数字,C++实现

    原创博文,转载请注明出处! # 题目 数组中有一个数字出现的次数超过数组长度的一半,请找出这个数字.例如输入一个长度为9的数组{1,2,3,2,2,2,5,4,2}.由于数字2在数组中出现了5次,超过 ...

  7. PHP---文件上传与下载

    转自http://www.cnblogs.com/lazycat-cz/p/4113037.html 安全性能---水平不够 ╮(╯_╰)╭ 文件上传--->就是将本地的文件上传到服务器上.(H ...

  8. CF1117D Magic Gems

    CF1117D Magic Gems 考虑 \(dp\) , \(f[i]\) 表示用 \(i\) 个单位空间的方案数,答案即为 \(f[n]\). 对于一个位置,我们可以放 \(Magic\) 的, ...

  9. BZOJ4128 Matrix 【BSGS】

    BZOJ4128 Matrix Description 给定矩阵A,B和模数p,求最小的x满足 A^x = B (mod p) Input 第一行两个整数n和p,表示矩阵的阶和模数,接下来一个n * ...

  10. Ecel 粘贴图片并调整大小,移到底层

    Sub Click() ActiveSheet.Pictures.Paste.Select Selection.ShapeRange.ScaleWidth 1.4, msoTrueSelection. ...