1. async(可选)
表示应该立即开始下载脚本,但不能阻止其他页面动作,比如下载资源或等待其他脚本加载。
注意:async 属性仅适用于外部脚本(只有在使用 src 属性时)。
async 属性一旦脚本可用,则会异步加载,加载的过程不会造成阻塞,一旦加载完毕就会执行代码,执行的过程是同步的,如果此时已经解析完 HTML,那就不阻塞;否则就是阻塞的。
async 脚本的执行时机是无法确定的,因为脚本何时加载完毕是不确定的。
如果存在多个 async 的话,标记为 async 的脚本并不能保证按照指定它们的书写先后顺序执行。
这就导致如果要在异步 JS 脚本中获取某个 DOM 元素,有可能获取到,也有可能获取不到。
执行外部脚本时,使用 async:脚本相对于页面的其余部分异步地执行(当页面继续进行解析时,脚本将被执行)。
2. defer(可选)
表示脚本可以延迟到文档完全被解析和显示之后再执行。
只对外部脚本文件有效。在 IE7 及更早的版本中,对行内脚本也可以指定这个属性。
使用 defer 获取 JavaScript 脚本的请求也是异步的,但它不会阻塞浏览器解析 HTML。
脚本下载完毕后不会立即执行,要等到页面解析完毕之后再执行。
defer 的脚本中不应该出现 document.write 的操作,浏览器会直接忽略这些操作。
如果存在多个 defer,脚本会按书写顺序依次执行,不会破坏脚本间的代码依赖,但是 IE<=9 中存在一个 bug,会导致脚本的执行顺序可能会被打乱,从而导致代码依赖可能会出错。
IE<=9 的 bug:假如我们向文档中增加了多个 defer 的脚本,而且之前的脚本中有 appendChild,innerHTML,insertBefore,replaceChild 等修改了 DOM 的接口调用,那么后面的脚本可能会先于该脚本执行。
因此实际项目中很少会使用 defer 特性,而将脚本代码放置在页面底部可以替代defer所提供的功能。
执行外部脚本时,使用 defer:脚本将在页面完成解析时执行。
执行外部脚本时,既不使用 async 也不使用 defer:在浏览器继续解析页面之前,立即读取并执行脚本。
3. src(可选)
表示包含要执行的代码的外部文件。
4. charset(可选)
使用 src 属性指定的代码字符集。
这个属性很少使用,因为大多数浏览器不在乎它的值。
5. crossorigin(可选)
配置相关请求的 CORS(跨域资源共享)设置。默认不使用 CORS。
crossorigin= "anonymous" 配置文件请求不必设置凭据标志。
crossorigin= "use-credentials" 设置凭据标志,意味着出站请求会包含凭据。
6. integrity(可选)
允许比对接收到的资源和指定的加密签名以验证子资源完整性(SRI,Subresource Integrity)。
如果接收到的资源的签名与这个属性指定的签名不匹配,则页面会报错,脚本不会执行。
这个属性可以用于确保内容分发网络(CDN,Content Delivery Network)不会提供恶意内容。
7. type(可选)
代替 language,表示代码块中脚本语言的内容类型(也称 MIME 类型)。
按照惯例,这个值始终都是 "text/javascript",尽管 "text/javascript" 和 "text/ecmascript" 都已经废弃了。
JavaScript 文件的 MIME 类型通常是 "application/x-javascript",不过给 type 属性这个值有可能导致脚本被忽略。
在非 IE 的浏览器中有效的其他值还有 "application/javascript" 和 "application/ecmascript"。
如果这个值是 module,则代码会被当成 ES6 模块,而且只有这时候代码中才能出现 import 和 export 关键字。
8. language(废弃)
最初用于表示代码块中的脚本语言(如 "JavaScript","JavaScript 1.2" 或 "VBScript")。
大多数浏览器都会忽略这个属性,不应该再使用它。