带前端脚本的html页面,2.从头学前端之如何在html中使用javascript

使用

嵌入脚本与外部脚本

文档模式对JavaScript的影响

考虑禁用 JavaScript 的场景

使用

script 元素有6个属性：

async: 可选。表示应该立即下载脚本，但不应妨碍页面中的其他操作，比如下载其他资源或 等待加载其他脚本。只对外部脚本文件有效。(个人理解：如果多个js指定了async属性，无法保证js按照顺序加载；如果js中有可以阻断js运行的代码如报错，或者alert，还是可能会阻断页面中的操作的)

charset:可选。表示通过 src 属性指定的代码的字符集。由于大多数浏览器会忽略它的值， 因此这个属性很少有人用。

defer:可选。表示脚本可以延迟到文档完全被解析和显示之后再执行。只对外部脚本文件有 效。IE7 及更早版本对嵌入脚本也支持这个属性。(个人理解：该属性和async一样，浏览器会单独开启一个线程去下载js,但是不会下载完成后和async一样立即执行，而是等到文档加载完成后再去解析，多个js文件使用defer属性可以保证加载的顺序)

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。

下图是google中js的类型(Content-Type即MIME)：

image.png

使用

直接在页面中嵌入 JavaScript 代码;

包含外部 JavaScript 文件。

在使用

function sayHi(){

alert("Hi!");

}

如果要通过

!!!需要注意的是，带有 src 属性的标签之间再 包含额外的 JavaScript 代码。如果包含了嵌入的代码，则只会下载并执行外部脚本文件，嵌入的代码 会被忽略。

无论如何包含代码，只要不存在 defer 和 async 属性，浏览器都会按照

标签的位置

Web 应用程序一般都把全部 JavaScript 引 用放在

元素中页面内容的后面

Example HTML Page