Javascript 异步处理与计时跳转
实现计时跳转的代码:
<html lang="en">
<head>
<meta charset="UTF-8">
<title>无内容</title>
</head>
<body>
未找到结果, <span id="secound">3</span> 秒后跳转到首页
<script type="text/javascript"> var sec = document.getElementById("secound")
var interval = parseInt(sec.innerText); (function () {
if (interval > 0) {
setTimeout(arguments.callee, 1000);
sec.innerText = interval;
interval--;
} else {
window.location.href = "/";
}
})();
</script> </body>
</html>
了解下 从setTimeout谈JavaScript运行机制(原文可能有出入,请仔细鉴别)
一段js代码(里面可能包含一些setTimeout、鼠标点击、ajax等事件),从上到下开始执行,遇到setTimeout、鼠标点击等事件,异步执行它们,此时并不会影响代码主体继续往下执行(当线程中没有执行任何同步代码的前提下才会执行异步代码),一旦异步事件执行完,回调函数返回,将它们按次序加到执行队列中,这时要注意了,这表示异步事件执行,但回调不会立即返回,需要等主体函数完成。这也就是上面的一段代码导致浏览器假死的原因(主体代码中的while(true){}还没执行完)。
(function() {
console.log(1);
setTimeout(function(){console.log(2)}, 1000);
setTimeout(function(){console.log(3)}, 0);
console.log(4);
})();
所以在控制台输出
1
4
undefined // 整体函数返回值
3
2
扩展:script 标签的下载同步/异步与执行同步 参考

结论:js 在执行的时候,html 会阻塞渲染,js 执行完毕 html 可以继续渲染。这样的规定也与 js 单线程模型相契合,因为对于html来说 dom 是共享变量,如果 js是多线程或者 js执行与 dom渲染操作是并行的,则可能会发生资源抢占问题。
Javascript 异步处理与计时跳转的更多相关文章
- JavaScript异步编程原理
众所周知,JavaScript 的执行环境是单线程的,所谓的单线程就是一次只能完成一个任务,其任务的调度方式就是排队,这就和火车站洗手间门口的等待一样,前面的那个人没有搞定,你就只能站在后面排队等着. ...
- 【转】JavaScript 异步进化史
前言 JS 中最基础的异步调用方式是 callback,它将回调函数 callback 传给异步 API,由浏览器或 Node 在异步完成后,通知 JS 引擎调用 callback.对于简单的异步操作 ...
- Promises与Javascript异步编程
Promises与Javascript异步编程 转载:http://www.zawaliang.com/2013/08/399.html 在如今都追求用户体验的时代,Ajax应用真的是无所不在.加上这 ...
- 通过javascript库JQuery实现页面跳转功能代码
通过javascript库JQuery实现页面跳转功能代码的四段代码实例如下. 实例1: 1 2 3 4 $(function(){ var pn = $("#gotopagenum&quo ...
- 转: Promises与Javascript异步编程
在如今都追求用户体验的时代,Ajax应用真的是无所不在.加上这些年浏览器技术.HTML5以及CSS3等的发展,越来越多的富Web应用出现:在给与我们良好体验的同时,Web开发人员在背后需要处理越来越多 ...
- 用Html5/CSS3做Winform,一步一步教你搭建CefSharp开发环境(附JavaScript异步调用C#例子,及全部源代码)上
本文为鸡毛巾原创,原文地址:http://www.cnblogs.com/jimaojin/p/7077131.html,转载请注明 CefSharp说白了就是Chromium浏览器的嵌入式核心,我们 ...
- Javascript异步编程之setTimeout与setInterval详解分析(一)
Javascript异步编程之setTimeout与setInterval 在谈到异步编程时,本人最主要会从以下三个方面来总结异步编程(注意:特别解释:是总结,本人也是菜鸟,所以总结不好的,请各位大牛 ...
- JavaScript 异步进化史
前言 JS 中最基础的异步调用方式是 callback,它将回调函数 callback 传给异步 API,由浏览器或 Node 在异步完成后,通知 JS 引擎调用 callback.对于简单的异步操作 ...
- ajax异步加载回跳定位
1)首先,问题是这样的:page1在一个滚动到页面底部加载更新的函数(功能),当页面滚动了第二页(或更多页)时,点击链接跳转到了其他页面(page2),在page2有返回按钮,当从page2返回pag ...
随机推荐
- Python多进程池 multiprocessing Pool
1. 背景 由于需要写python程序, 定时.大量发送htttp请求,并对结果进行处理. 参考其他代码有进程池,记录一下. 2. 多进程 vs 多线程 c++程序中,单个模块通常是单进程,会启动几十 ...
- 开源GIS浅谈 【转】
http://blog.csdn.net/happyduoduo1/article/details/51773850 谈到GIS软件,首先让我们想到的是GIS界的龙头大哥ESRI公司旗下的ArcGIS ...
- MySQL表与表之间的SQL Joins图介绍
下图很好的解释了各表之间SQL Joins之间的关系
- Jupyter notebook安装扩展插件
1. 安装Jupyter Notebook pip install jupyter 2. 安装Jypyter Notebook扩展包 pip install jupyter_contrib_nbext ...
- C#读取Excel文件的简单方法
一.简述 本文讲C#通过第三方库读取Excel的最简单的方法,下文给一个读取行数的例子. 二.依赖 引入nuget.org包如下: <?xml version="1.0" e ...
- corda
账本:corda 从每个节点的视角看待账本都是不一样的.并不是所有节点有所有账本信息的.valut视为SQL数据库,只保存 两两节点之间的数据库 状态:状态是不变的对象,代表共享的事实,比如特定时间的 ...
- svn安装教程
svn服务器端下载(VisualSVN) 安装包,选择windows版的VisualSVN-Server https://www.visualsvn.com/downloads/ svn客户端下载(T ...
- Sql Server 中将由逗号“,”分割的一个字符串转换为一个表集,并应用到 in 条件中
Sql Server 中将由逗号“,”分割的一个字符串,转换为一个表,并应用与 in 条件 ,,) 这样的语句和常用,但是如果in 后面的 1,2,3是变量怎么办呢,一般会用字符串连接的方式构造sql ...
- Spark On Yarn的两种模式yarn-cluster和yarn-client深度剖析
Spark On Yarn的优势 每个Spark executor作为一个YARN容器(container)运行.Spark可以使得多个Tasks在同一个容器(container)里面运行 1. Sp ...
- hdoj:2055
#include <iostream> #include <string> using namespace std; bool islower(char ch) { if (c ...