js高级第三版(第二章 在 HTML 中使用 JavaScript )

2.1 <script>元素

    HTML 4.01 为<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。)

    使用<script>元素的方式有两种:直接在页面中嵌入 JavaScript 代码和包含外部 JavaScript文件。

    无论如何包含代码,只要不存在 defer 和 async 属性,浏览器都会按照<script>元素在页面中出现的先后顺序对它们依次进行解析。

    2.1.1 标签的位置

<!DOCTYPE html>
<html>
 <head>
  <title>title</title>
  <!-- 这里是js标签位置 -->
 </head>
 <body>
  <!-- 这里放内容 -->
  <!-- 这里是js标签位置 -->
 </body>
</html>

    2.1.2 延迟脚本

    在<script>元素中设置defer 属性,相当于告诉浏览器立即下载,但延迟执行。

    注:在XHTML 文档中,要把 defer 属性设置为 defer="defer"。

    2.1.3 异步脚本

    HTML5 为<script>元素定义了 async 属性。这个属性与 defer 属性类似,都用于改变处理脚本的行为。同样与 defer 类似,async 只适用于外部脚本文件,并告诉浏览器立即下载文件。但与 defer不同的是,标记为 async 的脚本并不保证按照指定它们的先后顺序执行。

    注:同时引用两个js脚本时确保两者不相互依赖。!!!

    2.1.4 在XHTML中的用法

    在将页面的 MIME 类型指定为"application/xhtml+xml"的情况下会触发XHTML 模式。并不是所有浏览器都支持以这种方式提供 XHTML 文档。

    2.1.5 不推荐使用的语法  

<script><!--
     function sayHi(){
         alert("Hi!");
     }
//--></script> 
    2.2 嵌入代码与外部文件

        优点:可维护性,可缓存,适应未来

    2.3 文档模式

        IE5.5 引入了文档模式的概念,而这个概念是通过使用文档类型(doctype)切换实现的。

    2.4 <noscript>元素    

<html>
 <head>
 <title>Example HTML Page</title>
 <script type="text/javascript" defer="defer" src="example1.js"></script>
 <script type="text/javascript" defer="defer" src="example2.js"></script>
 </head>
 <body>
 <noscript>
 <p>本页面需要浏览器支持(启用)JavaScript。
 </noscript>
 </body>
</html> 
    这个页面会在脚本无效的情况下向用户显示一条消息。而在启用了脚本的浏览器中,用户永远也不会看到它——尽管它是页面的一部分。

猜你喜欢

转载自blog.csdn.net/lugr_shx/article/details/80739467