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作为一个基于对象(没有类的概念)的语言,从入门到精通到放弃一直会被对象这个问题围绕 ...
随机推荐
- flex引起height:100%失效
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...
- ESXi5.5下的Centos7虚机配置静态IP
使用的是osboxes.org上下载的已安装centos7 image, 在启动后, ifconfig不能看到网卡, 需要关机后在ESXi客户端编辑虚机, 删除网卡, 保存, 添加网卡, 网卡类型选择 ...
- 3172: [Tjoi2013]单词
3172: [Tjoi2013]单词 Time Limit: 10 Sec Memory Limit: 512 MBSubmit: 3246 Solved: 1565[Submit][Status ...
- 洛谷P1111 修复公路
题目背景 A地区在地震过后,连接所有村庄的公路都造成了损坏而无法通车.政府派人修复这些公路. 题目描述 给出A地区的村庄数N,和公路数M,公路是双向的.并告诉你每条公路的连着哪两个村庄,并告诉你什么时 ...
- 【C#】【Thread】SpinLock
SpinLock结构是一个低级别的互斥同步基元,它在等待获取锁时进行旋转. 在多核计算机上,当等待时间预计较短且极少出现争用情况时,SpinLock 的性能将高于其他类型的锁. 不过,我们建议您仅在通 ...
- CSS继承的特殊性
p{color:red;} .first{color:green;} <p class="first">三年级时,我还是一个<span>胆小如鼠</s ...
- XUtils框架之初步探索
Xutils分为四大模块. BitmapUtils DBUtils ViewUtils HttpUtils
- Linux下压缩音频文件
安装工具 sudo apt-get install lame 具体用法可以查看帮助 lame --help 通过更改音频文件的帧数 可以让文件变小 但是音质也会随之下降 现在比较多的mp3文件是1 ...
- mui消息框alert,confirm,prompt,toast
<script type="text/javascript" charset="utf-8"> //mui初始化 mui.init({ swipeB ...
- bzoj4726【POI2017】Sabota?
首先可以推出来如果i没有带头叛变,那么i的父亲也一定不会带头叛变,证明显然 所以最劣情况初始的叛徒肯定是叶子,并且带头叛变的人一定是从某个叶子往上走一条链 f[i]表示i不带头叛变的话最小的x 那么我 ...