2.1 <script>元素
向HTML页面中插入JavaScript的主要方法,就是使用<script>元素;
HTML 4.01为<script>定义了下列6个属性:
* async:可选。表示应该立即下载脚本,但不应妨碍页面中的其他操作,比如下载其他资源或者等待加载其他脚本。只对外部脚本文件有效。
* charset:可选。表示通过 src 属性指定的代码的字符集。(大多数浏览器会忽略它的值,所以这个属性很少有人用)。
* defer:可选。表示脚本可以延迟到文档完全被解析和显示之后再执行。只对外部脚本文件有效。
* language:已废弃。原来用于表示编写代码使用的脚本语言(如JavaScript、JavaScript1.2或VBScript)。
* src:可选。表示包含要执行代码的外部文件。
* type:可选。可以看成是language的替代属性;表示编写代码使用的脚本语言的内容类型(也称为MIME类型。)。服务器在传送JavaScript文件时使用的MIME类型通常是application/x-javascript。目前type属性值依旧还是:text/javascript。如果没有这个属性,默认值仍为:text/javascript。
使用<script>元素的方式有两种:直接在页面中嵌入 JavaScript 代码和包含外部 JavaScript 文件。
在使用<script>元素嵌入 JavaScript代码时,只须为<script>指定 type 属性。然后将 JavaScript 代码直接放在元素内部即可,如下:
包含在<script>元素内部的 JavaScript 代码将被从上至下一次解释。解释器会解释一个函数的定义,然后将该定义保存在自己的环境当中。在解释器对<script>元素内部的所有代码求值完毕以前,页面中的其余内部都不会被浏览器加载或显示。
在使用<script>嵌入 JavaScript 代码时,记住不要在代码中的任何地方出现"</script>"字符串。如下错误:
"); };
按照解析嵌入代码的规则,当浏览器遇到字符串"</script>"时,就会认为那是结束的</script>标签。从而错误。
通过:转义字符 "\" 可以解决这个问题,例如:
这样写代码,浏览器可以接受,因而也就不会导致错误。
如果要通过<script>元素来包含外部 JavaScript 文件,那么 src 属性就是必需的。这个属性的值是一个指向外部 JavaScript 文件的链接,例如:
<script type="text/javascript" src="example.js"></script>
在这个例子中,外部文件example.js将被加载到当前页面中。与解析嵌入式 JavaScript 代码一样,在解析外部 JavaScript 文件(包含下载该文件)时,页面的处理也会暂时停止。如果是在 XHTML 文档中,可以省略前面示例代码中结束的</script>标签,例如:
<script type="text/javascript" src="example.js" />
但是,不能在 HTML 文档使用这种语法。原因是这种语法不符合 HTML 规范,也得不到某些浏览器(尤其是IE)的正确解析。
按照惯例,外部 JavaScript 文件带有.js扩展名。但这个扩展名不是必须的。因为浏览器不会检查包含 JavaScript 的文件的扩展名。这样一来,使用JSP、PHP或其他服务器端语言动态生成 JavaScript 代码也就成为了可能。 但是,服务器通常还是需要看扩展名决定为响应应用那种 MIME 类型。如果不使用 .js 扩展名,请确保服务器能返回正确的 MIME 类型。
需要注意的是,带有 src 属性的<script>元素不应该在其<script>和</script>标签之间再包含额外的 JavaScript 代码。如果包含了嵌入的代码,则只会下载并执行外部脚本文件,嵌入的代码会被忽略。
另外,通过<script>元素的 src 属性还可以包含来自外部域的 JavaScript 文件。这一点既让<script>元素倍显强大,又让它备受争议。例如:
<script type="text/javascript" src=></script>
这样,位于外部域中的代码也会被加载和解析。
利用这一点就可以在必要时通过不同的域来提供 JavaScript 文件。
不过在访问自己不能控制的服务器上的 JavaScript 文件时则要多加小心。如果不幸遇到怀有恶意的程序员,那他们随时都可能替换该文件中的代码。so,如果想包含来自不同域的代码,则要么你是那个域的所有者,要么那个域的所有者值得信赖。
无论如何包含代码,只要不存在 defer 和 async 属性,浏览器都会按照<script>元素在页面中的先后顺序对他们依次进行解析。