js setTimeout 与 setInterval 以及 for 循环 刷新UI
1. setTimeout() 方法用于在指定的毫秒数后调用函数或计算表达式；执行一次；
如果需要执行多次，自身再次调用 setTimeout()；
示例：无穷循环并带停止按钮的
<html>
<head>
<script type="text/javascript">
var c=0
var t
function timedCount()
{
document.getElementById('txt').value=c
c=c+1
t=setTimeout("timedCount()",1000)
} function stopCount()
{
clearTimeout(t)
}
</script>
</head> <body>
<form>
<input type="button" value="开始计时！" onClick="timedCount()">
<input type="text" id="txt">
<input type="button" value="停止计时！" onClick="stopCount()">
</form> <p>
请点击上面的“开始计时”按钮。输入框会从 0 开始一直进行计时。点击“停止计时”可停止计时。
</p> </body> </html>
2. setInterval() 方法可按照指定的周期（以毫秒计）来调用函数或计算表达式；
setInterval() 方法会不停地调用函数，直到 clearInterval() 被调用或窗口被关闭。由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的参数。
示例：
<html>
<body> <input type="text" id="clock" size="35" />
<script language=javascript>
var int=self.setInterval("clock()",50)
function clock()
{
var t=new Date()
document.getElementById("clock").value=t
}
</script>
<button onclick="int=window.clearInterval(int)">Stop interval</button> </body>
</html>
二：扩展
1. 使用 setTimeout 和 setInterval 不会阻塞js网页的单线程页面操作；比如用js 改变页面的图片或，页面上的文字；
通常使用 for 循环 会影响页面的操作；
function test()
{
//假如 /tmp/ 目录下有4张图片，分别是 test0-3.png
//如下js 改变 id为 testIMG 的图片；
for(var i=0;i<4;i++)
{
alert(i);
document.getElementById("testIMG".src="/tmp/test"+String(i)+".png";
} //运行结果，在网页上，会依次弹出 4次 alert；但是图片不会依次切换，而是要等到最后一次，显示最后一张图片；
}
所以，上面的问题要 使用 setTimeout, setInterval 操作；
2. 还有一点，js 对于 同一个 id 的 img标签；在两次改变图片时，，如果图片的名字一样，，图片不一样，，图片不会改变；
即是 第一次 js 改变图片 为 a.png;
第二次 a.png 图片发生变化了，但是名字还是 a.png；但是此时用js 改变时，页面上的图片不会刷新
参考：http://www.w3school.com.cn/jsref/met_win_settimeout.asp
http://www.w3school.com.cn/jsref/met_win_setinterval.asp
js setTimeout 与 setInterval 以及 for 循环 刷新UI的更多相关文章
- js setTimeout和setInterval区别
1.区别 2.示例代码 <!DOCTYPE html> <html lang="zh"> <head> <meta charset=&qu ...
- js:setTimeout 与 setInterval 比较
在javascript中有两个非常有用的函数:setTimeout 和setInterval ,都是定时器:但是两者存在着一些区别: 1. setTimeout函数 用法:setTimeout(fn, ...
- js setTimeout 和 setInterval 区别
setTimeout和setInterval的语法相同.它们都有两个参数,一个是将要执行的代码字符串,还有一个是以毫秒为单位的时间间隔,当过了那个时间段之后就将执行那段代码.不过这两个函数还是有区别的 ...
- js的事件循环机制：同步与异步任务（setTimeout，setInterval）宏任务，微任务（Promise，process.nextTick）
javascript是单线程,一切javascript版的"多线程"都是用单线程模拟出来的,通过事件循环(event loop)实现的异步. javascript事件循环 事件循环 ...
- 关于js中的setTimeout和setInterval
http://ejohn.org/blog/how-javascript-timers-work 这是John的一篇博文说到setTimeout和setInterval的区别,在看js高效图形编程的时 ...
- 原生js轮播以及setTimeout和setInterval的理解
下面这个代码是从一个群下载下来的,为了帮助自己理解和学习现在贴出来,与初学者共勉. <!DOCTYPE html> <html> <head> <meta c ...
- js中的setTimeout和setInterval
在html页面中要使用自动刷新功能时,可以是使用js中setTimeout和setInterval: 一.使用方法 setTimeout的使用setTimeout('要调用的Js方法', 调用的延迟时 ...
- 【转】JS中setTimeout和setInterval的最大延时值详解
前言 JavaScript提供定时执行代码的功能,叫做定时器(timer),主要由setTimeout()和setInterval()这两个函数来完成.而这篇文中主要给大家介绍的是关于JS中setTi ...
- js中两种定时器，setTimeout和setInterval的区别
setTimeout只在指定时间后执行一次,代码如下: <script> //定时器 异步运行 function hello(){ alert("hello&qu ...
随机推荐
- linux 开启wifi热点
1,在网络连接管理中创建一个wifi连接,点击 Add,然后选Wi-Fi 2,设置wifi热点名字.wifi接连名字 3,设置 Mode 选 Ad-hoc,其它默认. 4,在 Wi-Fi Securi ...
- Java过滤器原理方法
过滤器可以对资源的请求和相应提供过滤功能,配置在web.xml文件中.过滤器可用来实现以下功能1. 权限过滤2. 登陆和检查验证3. 图像转换4. 数据压缩5. 加密6. 令牌验证7. 触发访问资源的 ...
- ：判断101-200之间有多少个素数，并输出所有素数。 程序分析：判断素数的方法：用一个数分别去除2到sqrt(这个数)，如果能被整除， 则表明此数不是素数，反之是素数。
package C; public class Sushu { public static void main(String[] args) { int sum=0; for (int i = 101 ...
- FreeSWITCH第三方库（音频）的简单介绍（一）
FreeSWITCH使用了大量的第三方库,本文档主要介绍音频相关库的信息: 视频相关库的信息介绍参考:http://www.cnblogs.com/yoyotl/p/5488890.html 其他相关 ...
- Django 查询很经典的
版权归作者所有,任何形式转载请联系作者. 作者:petanne(来自豆瓣) 来源:https://www.douban.com/note/301166150/ 1.多表连接查询:感觉django太N ...
- [SAP ABAP开发技术总结]客户端文本文件、Excel文件上传下载
声明:原创作品,转载时请注明文章来自SAP师太技术博客( 博/客/园www.cnblogs.com):www.cnblogs.com/jiangzhengjun,并以超链接形式标明文章原始出处,否则将 ...
- APP前端公共测试点
- SAP接口编程 之 JCo3.0系列(01)：JCoDestination
SAP接口编程 之 JCo3.0系列(01):JCoDestination 字数2101 阅读103 评论0 喜欢0 JCo3.0是Java语言与ABAP语言双向通讯的中间件.与之前1.0/2.0相比 ...
- iOS8 获取通知设置状态
UIUserNotificationSettings *settings = [[UIApplication sharedApplication] currentUserNotificationSet ...
- web设计经验<六>令网站看起来不专业的10个设计误区
不管你是不是一个羽翼未丰企业的领导,专业的网站能为你带来的东西比你想象的多很多.退一万步来说,“考虑到我们是一个小厂”,粗糙的网站也许能被用户理解,但是不一定能接受.每天大家所浏览的大量的网站,已经从 ...