JS之计时器
JavaScript 计时事件
通过使用 JavaScript，我们有能力作到在一个设定的时间间隔之后来执行代码，而不是在函数被调用后立即执行。我们称之为计时事件。
在 JavaScritp 中使用计时事件是很容易的，两个关键方法是:
- setInterval() - 间隔指定的毫秒数不停地执行指定的代码。 间隔型
- setTimeout() - 暂停指定的毫秒数后执行指定的代码 延时型
1.setInterval() 方法
setInterval() 间隔指定的毫秒数不停地执行指定的代码
语法
window.setInterval("javascript function",milliseconds);
window.setInterval() 方法可以不使用window前缀，直接使用函数setInterval()。
setInterval() 第一个参数是函数（function）。
第二个参数间隔的毫秒数
PS: 1000 毫秒是一秒。
如何停止执行?
clearInterval() 方法用于停止 setInterval() 方法执行的函数代码。
语法
window.clearInterval(intervalVariable)
window.clearInterval() 方法可以不使用window前缀，直接使用函数clearInterval()。
要使用 clearInterval() 方法, 在创建计时方法时你必须使用全局变量：
myVar=setInterval("javascript function",milliseconds);
然后你可以使用clearInterval() 方法来停止执行。
2.setTimeout() 方法
语法
t=window.setTimeout(javascript function",毫秒数);
setTimeout() 方法会返回某个值。在上面的语句中，值被储存在名为 t 的变量中。假如你希望取消这个 setTimeout()，你可以使用这个变量名来指定它。
setTimeout() 的第一个参数是含有 JavaScript 语句的字符串。这个语句可能诸如 "alert('5 seconds!')"，或者对函数的调用，诸如 alertMsg()"。
第二个参数指示从当前起多少毫秒后执行第一个参数。
如何停止执行?
clearTimeout() 方法用于停止执行setTimeout()方法的函数代码。
语法
window.clearTimeout(timeoutVariable)
window.clearTimeout() 方法可以不使用window 前缀。
要使用clearTimeout() 方法, 你必须在创建超时方法中（setTimeout）使用全局变量:
myVar=setTimeout("javascript function",milliseconds);
如果函数还未被执行，你可以使用 clearTimeout() 方法来停止执行函数代码。
以下代码是我之前点击转换img代码的升级版，即 每隔3秒自动转换一次图片
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body onload="gaigai()">
<script>
function gaigai(){
setInterval(function ()
{
element=document.getElementById('im')
if (element.src.match("2"))
{
element.src="./1.jpg";
}
else
{
element.src="./2.jpg";
}
},3000);
}
</script> <img id="im" src="./2.jpg" /> </body>
</html>
JS之计时器的更多相关文章
- Nonove js timer 计时器
<html> <head> <title> Nonove js timer 计时器 </title> </head> <body> ...
- js函数：setInterval()/clearInterval()——js网页计时器
一.setInterval()/clearInterval()技术学习 都是window对象的方法,可以直接使用. setInterval(function(){},1000);:每1000毫秒执行一 ...
- JS倒计时器一只，顺便复习javascript时间相关函数
window.onload = function(){ var uS = 604800; //后台提供 : 秒 var day=hour=minute=second=0, timer; var dem ...
- js异步计时器
js中同步和异步的区别: 1.同步会阻塞代码执行,而异步不会 2.alert 是同步,setTimeout 是异步 何时需要异步 1.在可能发生等待的情况 2.等待过程中不能像 alert 一样阻塞程 ...
- js/javascript计时器方法及使用场景
开博以备忘 JavaScript实现计时事件很容易,两个关键方法 setTimeout(“JavaScript语句”,毫秒) 未来的某时执行代码 clearTimeout() 取消setTime ...
- 原生js实现计时器
https://www.cnblogs.com/sandraryan/ 点击开始计时,可以计次,暂停.点了暂停可以继续计时,计次,点击重置清空. <!DOCTYPE html> <h ...
- [原创作品]一个实用的js倒计时器 postby:zhutty.cnblogs.com
今天做了一个手机短信发送倒计时,额,就是每隔多长时间可以重新发送的功能.贡献出来给园有吐槽点评. //倒计时,time:时长(秒),scb:每秒回调,cb:计时完成回调 var timing = fu ...
- 京东首页原生----js制作|css动画|js动画|计时器--轮播图(好久没更新，这两天闲的蛋疼做个京东页面分辨率1366*768，919京东，适应没调！)要文件加关注找我要哦！
- js用计时器加载大量dom
改进前: <table><tbody></tbody></table> var tbody=document.getElementsByTagName( ...
随机推荐
- Leetcode 868. 二进制间距
868. 二进制间距 显示英文描述 我的提交返回竞赛 用户通过次数201 用户尝试次数220 通过次数207 提交次数396 题目难度Easy 给定一个正整数 N,找到并返回 N 的二进制表示中 ...
- python 小练习3
求大蜜题:给你两个正整数a(0 < a < 100000)和n(0 <= n <=100000000000),计算(a^n) % 20132013并输出结果 ret = 1 d ...
- laravel请求到响应的生命周期
请求到响应的核个执行过程,主要可以归纳为四个阶段,即程序启动准备阶段.请求实例化阶段.请求处理阶段.响应发送和程序终止阶段. public\index.php中有这么一段代码 $app = requi ...
- linux服务器磁盘扩容的方法
1.系统环境如下图: 2.为该系统添加一块新的虚拟硬盘,添加后需重启虚拟机,否则系统不识别:如下图,/dev/sdc 是新添加的硬盘: 3.fdisk /dev/sdc为新硬盘创建分区: 4.Linu ...
- django学习之——创建项目
创建项目让我迷茫了会: 直接cmd 执行django-admin.py startproject pro_name 肯定是不行的 必须cd到 D:\Program Files\Python3.3.5 ...
- Xmind settings lower
Xmind settings lower 1● setting 2● options 3● fast short keys 快捷键(Windows) 快捷键(Mac) 描述 Ctrl+N ...
- sql 中，如何获取两个日期之前月数、周数、天数
1.获取两个日期之间的月数.周数.天数语法 --1.获取两个日期之间的月数.周数.天数 --1.1)声明参数 ) ) --1.2)获取两个日期直接的月数 select DATEDIFF(MM,@sta ...
- Java版本知识
1zip是压缩包,而MSI文件是Windows Installer的数据包,它实际上是一个数据库,包含安装一种产品所需要的信息和在很多安装情形下安装(和卸载)程序所需的指令和数据,只要系统中包含win ...
- 【Java算法】获得一个随机字符串
package suanfa; import java.util.Random; public class RandomStr { public static String getRandomStr( ...
- linux系统管理 系统文件
常用的目录作用 '/' 根目录 '/bin' 命令保存目录(普通用户读取的命令) '/boot' 启动目录,启动相关文件 '/dev' 设备文件保存目录 '/etc' 配置文件保存目录 '/home' ...