红宝书——02.HTML

1.<script>元素

属性值：

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

使用方式

1.通过它直接在网页中嵌入 JavaScript 代码，以及通过它在网页中包含外部 JavaScript 文件。
2.嵌入行内 JavaScript 代码，直接把代码放在 <script> 元素中就行。

位置

1.<head> 标签内

目的是把外部的 CSS 和 JavaScript 文件都集中放到一起。不过，把所有 JavaScript文件都放在 <head> 里，也就意味着必须把所有 JavaScript 代码都下载、解析和解释完成后，才能开始渲染。

2. <body> 元素中的页面内容后面

页面会在处理 JavaScript 代码之前完全渲染页面。用户会感觉页面加载更快了，因为浏览器显示空白页面的时间短了。

2.行内代码与外部文件

外部文件更优：

 可维护性。JavaScript 代码如果分散到很多 HTML 页面，会导致维护困难。而用一个目录保存所有 JavaScript 文件，则更容易维护，这样开发者就可以独立于使用它们的 HTML 页面来编辑代码。
 缓存。浏览器会根据特定的设置缓存所有外部链接的 JavaScript 文件，这意味着如果两个页面都用到同一个文件，则该文件只需下载一次。这最终意味着页面加载更快。
 适应未来。通过把 JavaScript 放到外部文件中，就不必考虑用 XHTML 或前面提到的注释黑科技。包含外部 JavaScript 文件的语法在 HTML 和 XHTML 中是一样的。

3.文档模式

混杂模式（quirks mode）和标准模式（standards mode）。前者让 IE 像 IE5一样（支持一些非标准的特性），后者让 IE 具有兼容标准的行为。虽然这两种模式的主要区别只体现在通过 CSS 渲染的内容方面，但对JavaScript 也有一些关联影响。