浏览器中的script标签

浏览器中的 script 标签是再平常不过的标签了，如下列举了 script 标签常用的属性。

属性	是否必选	描述
async	可选	表示脚本不需要等待其它脚本，也不阻塞文档渲染，异步加载脚本，只对外部脚本文件有效。
crossorigin	可选	配置相关请求的 CORS（跨源资源共享）设置。默认不使用 CORS。crossorigin="anonymous"配置文件请求不必设置凭据标志。crossorigin="use-credentials"设置凭据标志，意味着出站请求会包含凭据。
defer	可选	表示脚本可以延迟到文档完全被解析和显示之后再执行。只对外部脚本文件有效。
integrity	可选	允许比对接收到的资源和指定的加密签名以验证子资源完整性（SRI，Subresource Integrity）。如果接收到的资源的签名与这个属性指定的签名不匹配，则页面会报错，脚本不会执行。这个属性可以用于确保内容分发网络（CDN，Content Delivery Network）不会提供恶意内容。
src	可选	引入外部的 js 文件
type	可选	表示代码块中脚本语言的内容类型（也称 MIME 类型）。按照惯例，这个值始终都是text/javascript，尽管text/javascript和text/ecmascript都已经废弃了。JavaScript 文件的 MIME 类型通常是application/x-javascript，不过给 type 属性这个值有可能导致脚本被忽略。在非 IE 的浏览器中有效的其他值还有application/javascript和application/ecmascript。如果这个值是 module，则代码会被当成 ES6 模块，而且只有这时候代码中才能出现 import 和 export 关键字。

关于 async 和 defer

script 标签默认是同步加载的，加上这两个标签中的任意一个，都可以让其异步执行，那么 async 和 defer 有什么区别？

使用 async 的脚本不能保证执行的顺序，即多个标记为 async 的 script 的执行顺序是不一定的。所以，async 脚本不应该在加载期间修改 DOM。

而 defer 标记的脚本会延迟到整个页面都解析完毕(DOMContentLoaded之前)再执行。使用 defer 标记的脚本相当于告诉浏览器立即下载，但是延迟执行。原则上按照它们列出的顺序进行执行。