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()理解的更多相关文章

  1. javascript的运行过程以及setTimeout的运行机制

    关于javascript的运行机制大家都应该有所了解了吧,其实javascript是一个单线程的机制,但是因为队列的关系它的表现会让我们感觉是一个多线程的错觉.javascript在运行的时候是这样的 ...

  2. JavaScript自运行函数(function(){})()的理解

    今天打开JQuery源文件(jquery-1.8.3), 看到JQuery的初始化过程是这样的 (function( window, undefined ) { // .... })( window ...

  3. JavaScript运行机制与setTimeout

    前段时间,老板交给了我一个任务:通过setTimeout来延后网站某些复杂资源的请求.正好借此机会,将JavaScript运行机制和setTimeout重新认真思考一遍,并将我对它们的理解整理如下. ...

  4. 理解JavaScript的运行

    JavaScript可以运行在head和body标签中! HTML的脚本必须放在<script></script>标签中间! 浏览器会解释并执行位于script标签中的脚本! ...

  5. 简述JavaScript的运行机制

    想要理解JavaScript的运行机制,需要分别深刻理解以下几个点: · JavaScript的单线程机制 · 任务队列(同步任务和异步任务) · 事件和回调函数 · 定时器 · Event Loop ...

  6. javascript引擎执行的过程的理解--执行阶段

    一.概述 同步更新sau交流学习社区(nodeJSBlog):javascript引擎执行的过程的理解--执行阶段 js引擎执行过程主要分为三个阶段,分别是语法分析,预编译和执行阶段,上篇文章我们介绍 ...

  7. 浅谈javascript的运行机制

    积累一下这几天学的,记录一下: 一.为什么JavaScript是单线程? JavaScript语言的一大特点就是单线程,也就是说,同一个时间只能做一件事.那么,为什么JavaScript不能有多个线程 ...

  8. 《Secrets of the JavaScript Ninja》:JavaScript 之运行时代码

    最近,在阅读 jQuery 之父 John Resig 力作:Secrets of the JavaScript Ninja(JavaScript忍者秘籍).关于第九章提及的 JavaScript 之 ...

  9. js对象详解(JavaScript对象深度剖析,深度理解js对象)

    js对象详解(JavaScript对象深度剖析,深度理解js对象) 这算是酝酿很久的一篇文章了. JavaScript作为一个基于对象(没有类的概念)的语言,从入门到精通到放弃一直会被对象这个问题围绕 ...

随机推荐

  1. flex引起height:100%失效

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  2. ESXi5.5下的Centos7虚机配置静态IP

    使用的是osboxes.org上下载的已安装centos7 image, 在启动后, ifconfig不能看到网卡, 需要关机后在ESXi客户端编辑虚机, 删除网卡, 保存, 添加网卡, 网卡类型选择 ...

  3. 3172: [Tjoi2013]单词

    3172: [Tjoi2013]单词 Time Limit: 10 Sec  Memory Limit: 512 MBSubmit: 3246  Solved: 1565[Submit][Status ...

  4. 洛谷P1111 修复公路

    题目背景 A地区在地震过后,连接所有村庄的公路都造成了损坏而无法通车.政府派人修复这些公路. 题目描述 给出A地区的村庄数N,和公路数M,公路是双向的.并告诉你每条公路的连着哪两个村庄,并告诉你什么时 ...

  5. 【C#】【Thread】SpinLock

    SpinLock结构是一个低级别的互斥同步基元,它在等待获取锁时进行旋转. 在多核计算机上,当等待时间预计较短且极少出现争用情况时,SpinLock 的性能将高于其他类型的锁. 不过,我们建议您仅在通 ...

  6. CSS继承的特殊性

    p{color:red;} .first{color:green;} <p class="first">三年级时,我还是一个<span>胆小如鼠</s ...

  7. XUtils框架之初步探索

    Xutils分为四大模块. BitmapUtils  DBUtils ViewUtils HttpUtils

  8. Linux下压缩音频文件

    安装工具 sudo apt-get install lame 具体用法可以查看帮助  lame --help 通过更改音频文件的帧数 可以让文件变小  但是音质也会随之下降 现在比较多的mp3文件是1 ...

  9. mui消息框alert,confirm,prompt,toast

    <script type="text/javascript" charset="utf-8"> //mui初始化 mui.init({ swipeB ...

  10. bzoj4726【POI2017】Sabota?

    首先可以推出来如果i没有带头叛变,那么i的父亲也一定不会带头叛变,证明显然 所以最劣情况初始的叛徒肯定是叶子,并且带头叛变的人一定是从某个叶子往上走一条链 f[i]表示i不带头叛变的话最小的x 那么我 ...