普通

<script src="script.js"></script> 没有 deferasync,浏览器会立即加载并执行指定的脚本,“立即” 指的是在渲染该 script 标签之下的文档元素之前,也就是说不等待后续载入的文档元素,读到就加载并执行。

async

<script async src="script.js"></script>async,加载和渲染后续文档元素的过程将和 script.js 的加载与执行并行进行(异步)。

defer

<script defer src="myscript.js"></script>defer,加载后续文档元素的过程将和 script.js 的加载并行进行(异步),但是 script.js 的执行要在所有元素解析完成之后,DOMContentLoaded 事件触发之前完成。(注意:带有defer属性的脚本执行也不一定按照顺序执行)

参见

javascript - defer 和 async 的区别 - SegmentFault 思否

JS - defer 和 async的更多相关文章

  1. JS—ajax及async和defer的区别

    ###1.ajax  “Asynchronous Javascript And XML”(异步 JavaScript 和 XML) 使用: 如不考虑旧版本浏览器兼容性, // 第一步创建xhr对象 v ...

  2. Js高设笔记1-2章 defer and async

    1,js是由ECMAscript ,dom ,bom组成的专为网页交互而设计的脚本语言.js是脚本语言之一. 2,MIME,是设定某种扩展名的文件用一种应用程序来打开的方式类型,当该扩展名文件被访问的 ...

  3. js中sync、defer、async的区别

    <script src="script.js"></script> 没有 defer 或 async,浏览器会默认为同步sync,会立即加载并执行指定的脚本 ...

  4. javascript的defer和async的区别。

    我们常用的script标签,有两个和性能.js文件下载执行相关的属性:defer和async defer的含义[摘自https://developer.mozilla.org/En/HTML/Elem ...

  5. script标签中defer和async属性的区别

    这篇文章来源于JS高级程序设计第三版中关于script标签的介绍,结合查阅的资料写下的学习笔记. 向html页面中插入javascript代码的主要方法就是通过script标签.其中包括两种形式,第一 ...

  6. defer 和 async 本地对象和宿主对象

    <script async></script> 没有defer和async的情况下是"同步执行"的,浏览器解析到这里的时候,会先加载资源完成后立即执行,并阻 ...

  7. 脚本引用中的defer和async的用法和区别

    之前的博客漫谈前端优化中的引用资源优化曾经提到过脚本引用异步设置defer.async,没有细说,这里展开一下,谈谈它们的作用和区别,先上张图来个针对没用过的小伙伴有个初始印象: 是的,就是在页面脚本 ...

  8. javascript中的defer和async学习+javascript执行顺序

    一.defer和async 我们常用的script标签,有两个和性能.js文件下载执行顺序相关的属性:defer和async defer的含义[摘自https://developer.mozilla. ...

  9. defer和async的区别

    先来试个一句话解释仨,当浏览器碰到 script 脚本的时候: <script src="script.js"></script> 没有 defer 或 a ...

随机推荐

  1. RS chap1:好的推荐系统

    一.什么是推荐系统 1.个性化推荐系统:从庞大的电影库中找几部符合你兴趣的电影供你选择. 2.推荐系统是帮助用户快速发现有用信息的工具.和搜索引擎不同的是,推荐系统不需要用户提供明确的需求,而是通过分 ...

  2. $id(id)函数

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. php邮件防注入以及实现经典代码

    <?php function spamcheck($field) {     // filter_var() 过滤 e-mail     // 使用 FILTER_SANITIZE_EMAIL ...

  4. EF部分字段修改 自动忽略为null字段

    传入一个实体 student(){id = 1,name = "测试" age = null,sex = null} 下面 是修改的方法 public async Task Edi ...

  5. python中的正则表达式的使用

    一.正则表达式简介 正则表达式的官方文档:https://www.runoob.com/regexp/regexp-tutorial.html 正则表达式:又称正规表示式.正规表示法.正规表达式.规则 ...

  6. AIX中文件系统管理

    1.文件系统类型 AIX主要支持的文件系统有: JFS(Journaled  File  Systems)   日志型文件系统     JFS2(Enhanced  Journaled  File S ...

  7. Python:JPG->JPEG

    由于要在网页上使用图片渐进加载,所以需要将其他图片格式转化为JPEG格式 考虑使用python来实现批量转换 需要先安装pillow: pip  install pillow 我这里将JPG格式转化为 ...

  8. 【洛谷P1730】最小密度路径

    题目大意:给定一个 N 个点,M 条边的有向图,现有 Q 个询问,每次询问 X 到 Y 的最小密度路径是多少.最小密度路径的定义是路径长度除以路径边数. 题解:利用矩阵乘法,可以预处理出从 X 到 Y ...

  9. Canvas + WebSocket + Redis 实现一个视频弹幕

    原文出自:https://www.pandashen.com 页面布局 首先,我们需要实现页面布局,在根目录创建 index.html 布局中我们需要有一个 video 多媒体标签引入我们的本地视频, ...

  10. vue history模式下的微信分享

    // 微信验证 export function requireConfig() { let url = window.location.href systemApi.wxoption({ url: u ...