<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. Spring之注解实现aop(面向切面编程)

    1:Aop(aspect object programming)面向切面编程,名词解释:    1.1:功能:让关注点代码与业务逻辑代码分离    1.2:关注点        重复代码就叫做关注点  ...

  2. Flip Game poj 1753

    Flip Game Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 29731   Accepted: 12886 Descr ...

  3. “一切都是消息”--MSF(消息服务框架)之【请求-响应】模式

    在前一篇, “一切都是消息”--MSF(消息服务框架)入门简介, 我们介绍了MSF基于异步通信,支持请求-响应通信模式和发布-订阅通信模式,并且介绍了如何获取MSF.今天,我们来看看如何使用MSF来做 ...

  4. swoole 入门

    1. 概述 Swoole是PHP的一个扩展,但是它与普通的扩展不同,普通的扩展知识提供一个库函数,而Swoole扩展在运行后会接管PHP的控制器,进入时间循环.当IO时间发生后,Swoole会自动回调 ...

  5. C-图文上边对齐

    1.效果 1.1 样式设置 2 效果  2.1 样式

  6. ASP.NET没有魔法——ASP.NET MVC 与数据库之Entity Framework Migrations

    在开发数据库应用程序的时候,经常会遇到某些表需要添加字段或者修改类型.新增表等需求,而对于EF Code First来说关注的只有实体类,当需求变更时只需要添加新的实体类或者在实体类中添加.删除.修改 ...

  7. Elasticsearch分片、副本与路由(shard replica routing)

    本文讲述,如何理解Elasticsearch的分片.副本和路由策略. 1.预备知识 1)分片(shard) Elasticsearch集群允许系统存储的数据量超过单机容量,实现这一目标引入分片策略sh ...

  8. JavaScriptOOP

    1. OOP基础 1.1面向对象编程OOP 1.语言的分类:      ① 面向机器:汇编语言      ② 面向过程:C语言      ③ 面向对象:C++ Java PHP 等   2.面向过程与 ...

  9. DevOps之存储和数据库

    唠叨话 关于德语噢屁事的知识点,仅提供专业性的精华汇总,具体知识点细节,参考教程网址,如需帮助,请留言. <数据(Data)> 了解有关数据部分.涉及存储及数据库的概念:知识与技能的层次( ...

  10. C#使用Xamarin开发可移植移动应用进阶篇(10.综合演练,来一份增删改查CRUD)

    前言 系列目录 C#使用Xamarin开发可移植移动应用目录 源码地址:https://github.com/l2999019/DemoApp 可以Star一下,随意 - - 说点什么.. 呃 也有半 ...