第2章 在 HTML中 使用 JavaScript

第2章 在 HTML中 使用 JavaScript

2.1 script 元素

2.1.1 标签的位置

2.1.2 延迟脚本

2.1.3 异步脚本

2.1.4 在XHTML中的使用

2.1.5 不推荐使用的语法

2.2 嵌入代码与外部文件

2.3 文档模式

2.4 noscript 元素

2.5 小结

重点内容摘要

2.1 <script> 元素

<script> 定义了下列6个属性：

• async ：可选。表示应该立即下载脚本，但不应妨碍页面中的其它操作，比如下载其他资源或等待加载其他脚本。只对外部脚本文件加载有效。
• charset : 可选。表示通过src属性指定的代码的字符集。由于大多数浏览器会忽略它的值，因此这个属性很少有人用。
• defer : 可选。表示脚本可以延迟到文档完全被解析和显示之后再执行。只对外部脚本文件有效。IE7 及更早版本对嵌入脚本也支持这个属性。
• language : 已废弃。原来用于表示便携代码使用的脚本语言（如JavaScript、JavaScript1.2或VBScript）。大多数浏览器会忽略这个属性，因此也没有必要再用了。
• src : 可选。表示包含要执行代码的外部文件。
• type : 可选。可以看成是language的代替属性；表示编写代码使用的脚本语言的内容类型（也成为MIME类型）。虽然text/javascript 和text/ecmascript 都已经不被推荐使用，但人们一直以来使用的都还是text/javascript。实际上，服务器在传送JavaScript文件时使用的MIME类型通常是application/x-javascript，但在type 中设置这个值缺可能导致脚本被忽略。另外，在非IE浏览器中还可以使用以下值：application/javascript 和application/ecmascript 。老绿道约定俗成和最大限度的浏览器兼容性，目前type属性的值依旧还是text/javascript 。不过，这个属性并不是必须的，如果没有指定这个属性，则其默认值仍为text/javascript。

使用标签之间在包含额外的JavaScript代码。如果包含了嵌入的代码，则只会下载并执行外部脚本文件，嵌入的代码会被忽略。

无论如何包含代码，只要不存在defer和async属性，浏览器都会按照元素在页面中出现的先后顺序对他们一次进行解析。换句话说，在第一个元素包含的代码解析完成后，第二个包含的代码才会被解析，然后才会是第三个、第四个......

2.2嵌入代码与外部文件

在HTML中嵌入JavaScript代码虽然没有问题，但一般认为最好的做法还是尽可能使用外部文件来包含JavaScript代码。不过并不存在必须使用外部文件的硬性规定，但支持使用外部文件的人多会强调如下优点：

• 可维护性：编辑不同HTML页面的JavaScript会造成维护问题。但把所有JavaScript 文件都放在一个文件夹中，维护起来就轻松多了。而且开发人员因此也能够在不触及HTML标记的情况下，集中精力编辑JavaScript代码。
• 可缓存。浏览器能够根据具体的设置缓存链接的所有外部JavaScript文件。也就是说，如果两个页面都是用同一个文件，那么这个文件只需要下载一次。因此，最终结果就是能够加快页面加载的速度。
• 适应未来：通过外部文件来包含JavaScript无须使用前面提到XHTML或注释hack。HTML和XHTML包含外部文件的语法是相同的。