<p><span id="span1">Hello World!</span></p>

<script type="text/javascript">
document.getElementById('span1').style.background = 'red';
alert(1); alert(2); alert(3);
</script>

先弹出1,弹2,弹3,之后span才改变背景色。why?

alert会阻塞所有线程,而且alert会被优先执行。

alert会阻塞所有线程,其中就包括GUI渲染线程(所以颜色不变)和主线程(所以setTimeout里面的任务只是在1秒后被添加到了任务队列里面,但是没有执行,需要你关闭了alert之后才会执行,但是你关闭第一个alert之后,马上又有同步任务了,所以那个第一个异步任务一直执行不了,必须等到所有同步任务执行完之后第一个异步任务才能执行, 后面两个异步任务同理)

参考:https://segmentfault.com/q/1010000006960660

alert 执行顺序问题的更多相关文章

  1. alert执行顺序

    <p><span id="span1">Hello World!</span></p> <script type=" ...

  2. JavaScript Alert 函数执行顺序问题

    * { color: #3e3e3e } body { font-family: "Helvetica Neue", Helvetica, "Hiragino Sans ...

  3. 对于javaScript中的alert和document.write()的执行顺序的记录

    代码: <script>//1----语句式的匿名函数创建以及调用 (function(name,age){ alert("name:"+name+",age ...

  4. alert执行时机和js线性模型 事件循环

    <div class="test">测试内容</div> <script> $('.test').text('内容改变') alert($('. ...

  5. 关于JavaScript预编译和执行顺序以及函数引用类型的思考

    昨晚在对项目中的一部分做模块化处理的时候,遇到了一个问题,一个重新定义的function对一个通用类中的function进行赋值覆盖的时候,失败了.问题抽象出来是这样的: <script > ...

  6. javaScript代码执行顺序

    javaScript是一种描述型脚本语言,由浏览器进行动态的解析和执行. 页面加载过程中,浏览器会对页面上载入的每个js代码块进行扫描. JavaScript是一段一段的分析执行的,在分析执行同一段代 ...

  7. javascript中的事件冒泡、事件捕获和事件执行顺序

    谈起JavaScript的 事件,事件冒泡.事件捕获.阻止默认事件这三个话题,无论是面试还是在平时的工作中,都很难避免. DOM事件标准定义了两种事件流,这两种事件流有着显著的不同并且可能对你的应用有 ...

  8. jquery mobile在页面加载时添加加载中效果 document.ready 和window.onload执行顺序比较

    想要添加这个效果,先来弄明白页面的加载和事件执行顺序,看这个简单例子: <html xmlns="http://www.w3.org/1999/xhtml"> < ...

  9. html/css基础篇——link和@inport详解以及脚本执行顺序探讨

    先说一说两者之间的异同 两者都可以引用外部CSS的方式,现在主流浏览器两者都支持(ps:@import是CSS2.1提出的),但是存在一定的区别: 1.link是XHTML标签,除了加载CSS外,还可 ...

随机推荐

  1. Linux入门之常用命令(5)Bash

    bash优点 1.命令编辑能力  记录使用过的命令 ~/.bash_history 记录上次的历史命令 2.补全功能  指令补全两下tab 文件名补全 3.命令别名  alias [别名]=‘’ 4. ...

  2. 关于如何获取iframe中的元素

    今天研究了一下iframe中元素的获取,发现有些地方还是有点坑的. 首先:如果使用纯前端手段,是没有办法获取非同源的iframe中的元素的,后面会提到后端手段 一.同源环境 1.首先在父页面获取ifr ...

  3. 使用jsonp完美解决跨域问题

    调用web接口,get请求,发现提示:No 'Access-Control-Allow-Origin' header is present on the requested resource. 这个和 ...

  4. apache 安装/mod_dir.so: undefined symbol: apr_array_clear

    apache 安装好后 启动出错: httpd: Syntax error on line 143 of /usr/local/apache2/conf/httpd.conf: Cannot load ...

  5. python中如何不区分大小写的判断一个元素是否在一个列表中

    python中判断某一个元素是否在一个列表中,可以使用关键字in 和 not in. 示例如下: 如果需要输出相应的信息,可以搭配使用if语句,这里不赘述. --------------------- ...

  6. ListBox数据绑定无效

    public class DataList { public List<string> listSource; private DataTable table; public DataLi ...

  7. django celery的分布式异步之路(二) 高并发

    当你跑通了前面一个demo,博客地址:http://www.cnblogs.com/kangoroo/p/7299920.html,那么你的分布式异步之旅已经起步了. 性能和稳定性是web服务的核心评 ...

  8. 小白学Maven第二篇配置Ecilpse

    Maven:里面提到了一个很重要的概念:中央仓库,本地仓库,私服: 中央仓库:是Maven通过一个地址索引去(http://mvnrepository.com/)下载需要的架包: 本地仓库:是Mave ...

  9. C#仪器数据文件解析-Word文件(doc、docx)

    不少仪器数据报告输出为Word格式文件,同Excel文件,Word文件doc和docx的存储格式是不同的,相应的解析Word文件的方式也类似,主要有以下方式: 1.通过MS Word应用程序的DCOM ...

  10. Java简单工厂模式以及来自lambda的优化

    前言    设计模式是软件工程中一些问题的统一解决方案的模型,它的出现是为了解决一些普遍存在的,却不能被语言特性直接解决的问题,随着软件工程的发展,设计模式也会不断的进行更新,本文介绍的是经典设计模式 ...