JS - defer 和 async
普通
<script src="script.js"></script> 没有 defer 或 async,浏览器会立即加载并执行指定的脚本,“立即” 指的是在渲染该 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的更多相关文章
- JS—ajax及async和defer的区别
###1.ajax “Asynchronous Javascript And XML”(异步 JavaScript 和 XML) 使用: 如不考虑旧版本浏览器兼容性, // 第一步创建xhr对象 v ...
- Js高设笔记1-2章 defer and async
1,js是由ECMAscript ,dom ,bom组成的专为网页交互而设计的脚本语言.js是脚本语言之一. 2,MIME,是设定某种扩展名的文件用一种应用程序来打开的方式类型,当该扩展名文件被访问的 ...
- js中sync、defer、async的区别
<script src="script.js"></script> 没有 defer 或 async,浏览器会默认为同步sync,会立即加载并执行指定的脚本 ...
- javascript的defer和async的区别。
我们常用的script标签,有两个和性能.js文件下载执行相关的属性:defer和async defer的含义[摘自https://developer.mozilla.org/En/HTML/Elem ...
- script标签中defer和async属性的区别
这篇文章来源于JS高级程序设计第三版中关于script标签的介绍,结合查阅的资料写下的学习笔记. 向html页面中插入javascript代码的主要方法就是通过script标签.其中包括两种形式,第一 ...
- defer 和 async 本地对象和宿主对象
<script async></script> 没有defer和async的情况下是"同步执行"的,浏览器解析到这里的时候,会先加载资源完成后立即执行,并阻 ...
- 脚本引用中的defer和async的用法和区别
之前的博客漫谈前端优化中的引用资源优化曾经提到过脚本引用异步设置defer.async,没有细说,这里展开一下,谈谈它们的作用和区别,先上张图来个针对没用过的小伙伴有个初始印象: 是的,就是在页面脚本 ...
- javascript中的defer和async学习+javascript执行顺序
一.defer和async 我们常用的script标签,有两个和性能.js文件下载执行顺序相关的属性:defer和async defer的含义[摘自https://developer.mozilla. ...
- defer和async的区别
先来试个一句话解释仨,当浏览器碰到 script 脚本的时候: <script src="script.js"></script> 没有 defer 或 a ...
随机推荐
- CentOS下配置Apache HTTPS
一.安装Apache支持SSL/TLS yum install mod_ssl openssl 二.创建证书 证书(Cerificate)的基本作用是将一个公钥和安全个体(个人.公司.组织等)的名字绑 ...
- Android 关于悬浮窗权限的问题
正常情况下的处理: dialog.getWindow().setType(WindowManager.LayoutParams.TYPE_SYSTEM_ALERT)以及在清单文件中添加 <use ...
- Maven项目构建利器03——第一个Maven工程
1.Maven工程的结构 我们需要通过Maven进行自动化构建, 以编译为例, Maven要想自动进行编译, 那么它必须知道Java源文件保存在哪里,所以要遵守Maven的约定,也就是约定大于配置,配 ...
- 012-zabbix主动模式
6.1 主动模式 zabbix agent检测分为主动(agent active)和被动(agent)两种形式,主动与被动的说法均是相对于agent来讨论的.简单说明一下主动与被动的区别如下: 主动: ...
- python grobal 的使用方法
写一个功能,运行报错,name 'number' is used prior to global declaration ,查资料梳理一下 因为这个函数需要调用多次,第一次调用的时候,走if语句,后面 ...
- linux shell鼠标键盘快捷键
- LVM介绍及相关操作
一.逻辑卷管理器介绍 逻辑卷管理器(英语:Logical Volume Manager,缩写为LVM),又译为逻辑卷宗管理器.逻辑扇区管理器.逻辑磁盘管理器,是Linux核心所提供的逻辑卷管理(Log ...
- 随机发送n位数字+字母的验证码
''' 随机发送n位数字+字母的验证码 ''' import random def get_verified(length): code = '' for i in range(length): nu ...
- SpringMVC 向页面传值-Map、Model和ModelMap
除了使用ModelAndView方式外.还可以使用Map.Model和ModelMap来向前台页面传值 使用后面3种方式,都是在方法参数中,指定一个该类型的参数.例如: Java代码 @Request ...
- Runnable和Thread比较
看代码 public static void main(String[] args) { // TODO Auto-generated method stub new MyThread().start ...