setTimeout与setInterval的区别
setTimeout与setInterval的区别:
1、setTimeout设置后隔指定时间后只会执行一次
2、setInterval设置后会每隔指定时间执行一次
3、setTimeout一般在方法内部使用达到循环调用的效果
4、setInterval一般在方法外部使用就可以达到循环调用效果
setTimeout例子:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript" language="javascript">
var timeout;
//显示时间
function displayTime(){
var date = new Date();
var hour = date.getHours();
hour = hour<10?"0"+hour:hour;
var minute = date.getMinutes();
minute = minute<10?"0"+minute:minute;
var second = date.getSeconds();
second = second<10?"0"+second:second;
//将时、分、秒组成时间
var time = hour+":"+minute+":"+second;
//将时间显示在文本框中
document.getElementById("txtTime").value = time;
//参数一:要调用的函数 参数二:延迟时间 返回值:Timeout对象
timeout = window.setTimeout("displayTime()",1000);
}
function stopTime(){
window.clearTimeout(timeout);//清除Timeout对象
}
function continueTime(){
timeout = window.setTimeout("displayTime()",1000);
}
</script>
</head>
<body onload="displayTime()">
<input type="text" id="txtTime" />
<input type="button" onclick="stopTime()" value="停止" />
<input type="button" onclick="continueTime()" value="继续" />
</body>
</html>
setInterval例子;
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript" language="javascript">
var timeout;
//显示时间
function displayTime(){
var date = new Date();
var hour = date.getHours();
hour = hour<10?"0"+hour:hour;
var minute = date.getMinutes();
minute = minute<10?"0"+minute:minute;
var second = date.getSeconds();
second = second<10?"0"+second:second;
//将时、分、秒组成时间
var time = hour+":"+minute+":"+second;
//将时间显示在文本框中
document.getElementById("txtTime").value = time;
}
function stopTime(){
window.clearTimeout(timeout);//清除Timeout对象
}
function continueTime(){
timeout = window.setInterval("displayTime()",1000);
}
timeout = window.setInterval("displayTime()",1000);
//window.onload窗体加载事件,后面接的函数不能加左右小括号
//window.onload = displayTime();//不会调用函数,会没效果
window.onload = displayTime;//正确
</script>
</head>
<body>
<input type="text" id="txtTime" />
<input type="button" onclick="stopTime()" value="停止" />
<input type="button" onclick="continueTime()" value="继续" />
</body>
</html>
setTimeout与setInterval的区别的更多相关文章
- setTimeout和setInterval的区别以及如何写出效率高的倒计时
1.setTimeout和setInterval都属于js中的定时器,可以规定延迟时间再执行某个操作,不同的是setTimeout在规定时间后执行完某个操作就停止了,而setInterval则可以一直 ...
- setTimeout()和setInterval()的区别
JS学习 - setTimeout()和setInterval()的区别 相同点 setTimeout 和 setInterval的语法相同.他们都有两个参数,一个是将要执行的代码字符串,还有一个是以 ...
- javascript中的两个定时函数setTimeOut()和setInterVal()的区别
js中经常性要用到间隔几秒或暂停几秒执行某个函数, 简单介绍我从网上收集到setTimeOut()和setInterVal()的区别1.setInterVal()介绍 1)定义 setInterval ...
- Javascript中setTimeout和setInterval的区别和使用
在javascript中,window对象有两个主要的定时方法,分别是setTimeout 和 setInterval,其语法基本上相同,但是完成的功能取有区别. setTimeout方法是定时程序, ...
- setTimeout()与setInterval()方法区别介绍
计时器setTimeout()和setInterval()两个都是js的计时功能的函数两个有些区别,下面为大家简单介绍下,希望对大家有所帮助 计时器setTimeout()和setInterval ...
- setTimeout和setinterval的区别
setTimeout("alert('久等了')",2000)是等待多长时间开始执行函数 setinterval(fn,1000)是每隔多长时间执行一次函数 setTimeout和 ...
- JavaScript中setTimeout()和setInterval()的区别
含义: setTimeout()和setInterval()经常被用来处理延时和定时任务.使用setTimeout()处理延时任务,而使用setInterval()方法处理定时任务: setTimeo ...
- setTimeout 和 setInterval 的区别
setTimeout (表达式,延时时间)setInterval(表达式,交互时间)延时时间/交互时间是以豪秒为单位的(1000ms=1s) setTimeout 在执行时,是在载入后延迟指定时间 ...
- setTimeout 与setInterval的区别
setTimeout(code,millisec) 方法用于在指定的毫秒数后调用函数或计算表达式 setInterval(code,millisec) 方法可按照指定的周期(以毫秒计)来调用函数或计算 ...
随机推荐
- MEF实现设计上的“松耦合”
C#进阶系列——MEF实现设计上的“松耦合”(二) 前言:前篇 C#进阶系列——MEF实现设计上的“松耦合”(一) 介绍了下MEF的基础用法,让我们对MEF有了一个抽象的认识.当然MEF的用法可能 ...
- Codeforces 383C . Propagating tree【树阵,dfs】
标题效果: 有一棵树,有两种操作模式对本树:1:表示为(1 x val),在NOx加在节点上val,然后x每个节点加上儿子- val.给每个儿子一个儿子在一起-(- val),加到没有儿子为止.2:表 ...
- 浅谈Hybrid技术的设计与实现(转)
前言 随着移动浪潮的兴起,各种APP层出不穷,极速的业务扩展提升了团队对开发效率的要求,这个时候使用IOS&Andriod开发一个APP似乎成本有点过高了,而H5的低成本.高效率.跨平台等特性 ...
- 使用requirejs实现模块化编程
> 序言 - -# 公司大了,业务多了,前端代码量也逐渐增大,我们渐渐的依赖js实现的交互越来越多,长期以来会导致我们的代码维护越来越困难,所以依赖的插件也越来越多..比如这样页面中有大量的js ...
- git 如何让单个文件回退到指定的版本
1.进入到文件所在文件目录,或者能找到文件的路径查看文件的修改记录 1 $ git log MainActivity.java 结果: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 ...
- dede织梦背景经常使用标签
一些非常实用的标签调用的方法 关键描写叙述调用标签: <meta name="keywords" content="{dede:field name='keywor ...
- jquery-ui-bootstrap动态添加和删除标签页封装【效果更炫】
1.效果图 2.导入js和css <link rel="stylesheet" href="css/bootstrap/css/bootstrap.min.css& ...
- Loadrunner11.00破解方法
1.下载 从http://www.jb51.net/softs/71240.html上面下载到loadrunner 11.0 2.安装loadrunner 11.0 下载之后,我是直接解压到硬盘,再安 ...
- javascript系列之DOM(三)---事件
原文:javascript系列之DOM(三)---事件 事件是javascript跳动的心脏,是DOM所有成分结合的万金油.当我们在WEB 上进行某些交互时,事件也就发生了.点击某些内容,鼠标经过特定 ...
- oracle_面试题01
完成下列操作,写出相应的SQL语句 创建表空间neuspace,数据文件命名为neudata.dbf,存放在d:\data目录下,文件大小为200MB,设为自动增长,增量5MB,文件最大为500MB. ...