JavaScript "自"运行-setInertval()和setTimeout()理解
setInterval()和clearInterval()
setInterval()在JS知识导图上属于 JS的 Windows对象方法, 参考www.w3school.com.cn 与我们最常用的alert()方法是"平行"的, 由于Window对象是浏览器全局对象,所以按照JS的编程习惯,window可以不用coding
var result = "Y";
function onOk()
{
var tid = setInterval(function () {
if (result == "Y")
{
window.location.href=window.location.href;
clearInterval(tid);
}
result = "N";
}, 3000);
}
//当点击一按钮3秒后,利用setInterval()方法刷新页面
setTimeout()和clearTimeout()
<div class="divSpace" style="text-align: center;">
<input type="submit" name="ctl00$ContentPlaceHolder1$bt" value="下一步" id="ContentPlaceHolder1_bt" class="btnSubmitYellow" />
</div> <script language="javascript" type="text/javascript">
var time = 10;
var timeout = null; //用于指引自运行的function的句柄,这里是window.setTimeout(enable_button, 1000);
function enable_button() {
var bt = document.getElementById("ctl00$ContentPlaceHolder1$bt");
if (time > 0) {
bt.value = '还剩余' + time + '秒';
bt.disabled = "true";
time = time - 1;
timeout = window.setTimeout(enable_button, 1000);
}
else {
bt.value = '开始测试';
bt.disabled = "";
window.clearTimeout(timeout);
}
} function window.onload() {
enable_button();
}
</script>
//倒计时实例
setTimeout()定义
1).它属于JS原生范畴, 和JS的Window(浏览器对象)等平行,参考
2).属于JavaScript计时器,让我们有能力作到在一个设定的时间间隔之后来执行代码,而不是在函数被调用后立即执行。我们称之为计时事件。
setTimeout和setInterval的区别你真的了解吗? 这篇文章以理解性翻译的形式讲解了setInterval()函数的意义,需要花些时间思考加以理解其中的意味.
Javascript程序都是以单线程的方式运行于浏览器的javascript引擎中的, setTimeout和setInterval的作用只是把我们要执行的代码在我们设定的一个时间点插入js引擎维护的一个代码执行队列中, 时间点待插入的代码不意味着一到时间点就会被立即插入,接着立即执行的,理解这一点很重要.
function click() {
// code block1...
setTimeout(function() {
// process ...
}, 200);
// code block2
}
3).当点击click事件, JS引擎开始执行code block1,执行setTime,接着执行code block2,到200m后,准备将process插入JS执行队列,如code block2执行超过200ms,按照文章的解释, setTime是不会将process过程插入到JS执行队列,必须等到click处理结束在执行process.
4).原生的setTime是没有循环执行的"味道"的,如果需要让setTime变成循环执行,需要自递归调用.
5).原生的setInterval是有循环执行的"味道"的,即每隔多少时间间隔,会将执行代码插入JS执行队列, 但是会发生会插入执行被打断的情况,在setTime一文中给了解释.
JavaScript "自"运行-setInertval()和setTimeout()理解的更多相关文章
- javascript的运行过程以及setTimeout的运行机制
关于javascript的运行机制大家都应该有所了解了吧,其实javascript是一个单线程的机制,但是因为队列的关系它的表现会让我们感觉是一个多线程的错觉.javascript在运行的时候是这样的 ...
- JavaScript自运行函数(function(){})()的理解
今天打开JQuery源文件(jquery-1.8.3), 看到JQuery的初始化过程是这样的 (function( window, undefined ) { // .... })( window ...
- JavaScript运行机制与setTimeout
前段时间,老板交给了我一个任务:通过setTimeout来延后网站某些复杂资源的请求.正好借此机会,将JavaScript运行机制和setTimeout重新认真思考一遍,并将我对它们的理解整理如下. ...
- 理解JavaScript的运行
JavaScript可以运行在head和body标签中! HTML的脚本必须放在<script></script>标签中间! 浏览器会解释并执行位于script标签中的脚本! ...
- 简述JavaScript的运行机制
想要理解JavaScript的运行机制,需要分别深刻理解以下几个点: · JavaScript的单线程机制 · 任务队列(同步任务和异步任务) · 事件和回调函数 · 定时器 · Event Loop ...
- javascript引擎执行的过程的理解--执行阶段
一.概述 同步更新sau交流学习社区(nodeJSBlog):javascript引擎执行的过程的理解--执行阶段 js引擎执行过程主要分为三个阶段,分别是语法分析,预编译和执行阶段,上篇文章我们介绍 ...
- 浅谈javascript的运行机制
积累一下这几天学的,记录一下: 一.为什么JavaScript是单线程? JavaScript语言的一大特点就是单线程,也就是说,同一个时间只能做一件事.那么,为什么JavaScript不能有多个线程 ...
- 《Secrets of the JavaScript Ninja》:JavaScript 之运行时代码
最近,在阅读 jQuery 之父 John Resig 力作:Secrets of the JavaScript Ninja(JavaScript忍者秘籍).关于第九章提及的 JavaScript 之 ...
- js对象详解(JavaScript对象深度剖析,深度理解js对象)
js对象详解(JavaScript对象深度剖析,深度理解js对象) 这算是酝酿很久的一篇文章了. JavaScript作为一个基于对象(没有类的概念)的语言,从入门到精通到放弃一直会被对象这个问题围绕 ...
随机推荐
- TCP协议的三次握手和四次挥手
暂时需要的信息有: ACK : TCP协议规定,只有ACK=1时有效,也规定连接建立后所有发送的报文的ACK必须为1 SYN(SYNchronization) : 在连接建立时用来同步序号.当SYN= ...
- OrchardNoCMS实体关系映射扩展
在OrchardNoCMS中,默认的系统会把实体关系映射保存到mappings.bin文件中. 如果不进行任何修改,默认的可以自动保存关系映射的model是有很大限制的. 条件是model的命名空间必 ...
- Android开发之Touch事件分发机制
原地址http://www.cnblogs.com/linjzong/p/4191891.html Touch事件分发中只有两个主角:ViewGroup和View.Activity的Touch事件事实 ...
- hibernate的三表查询
表的关系: Cardgraderule 1:n Cardgrade Cardgrade 1:n Acardtype 实体类: public class C ...
- iOS开发知识点总结
main文件做了这几件事: 1. 创建当前的应用程序 2. 根据4个参数的最后为应用程序设置代理类(默认情况下是AppDelegate) 3. 将appDelegate 和 应用程序 建立关联(指定代 ...
- iOS地图 -- 定位中的CLLocation的介绍与小练习
通过定位练习,熟悉CLLocation 在上篇笔记中提到了CLLocation类,这里通过练习来讲解一下这个类,类中包含了获取到的用户位置的信息 coordinate --> 坐标,经度和纬度 ...
- [转载]java int与integer的区别
声明: 本篇文章属于转载文章,来源:
- js 数据类型 typeof的测试
, t2 = ', t3 = null, t4 = NaN, t5 = undefined, t6 = function() {}, t7 = true, t8 = window, t9 = docu ...
- Java学习资料
微信扫码:http://v.dxsbb.com/jisuanji/Java之家:http://www.javazhijia.com/bs/biye/137.html一些 http://www.ibei ...
- Python学习笔记——集合类型
集合类型有两种不同的类型——可变集合(set)和不可变集合(frozenset) 可变集合不是可哈希的,不能用作字典的键,也不能用做其他集合中的元素 不可变集合是有哈希值的,能被用做字典的键或者是作为 ...