JavaScript 简介

1995 年，Netscape 公司的布兰登・艾奇（Brendan Eich），在 Netscape 浏览器上首次设计实现了 JavaScript。
JavaScript 是一种专为与网页交互而设计的脚本语言。

一个完整的 JavaScript 实现由三个不同的部分组成：

ECMAScript

ECMAScript 是 ECMA 制定的脚本语言标准，它用来标准化 JavaScript 语言的基本语法结构，它是 JavaScript 实现的基础。
由 ECMA-262 定义的 ECMAScript 与 Web 浏览器没有依赖关系，Web 浏览器只是 ECMAScript 实现可能的宿主环境之一。
不同 Web 浏览器对 ECMAScript 的兼容性不同。
ES6（即 ECMAScript 2015 ）于 2015 年 6 月 17 日发布。

DOM

文档对象模型（DOM）是针对 XML 但经过扩展用于 HTML 的应用程序编程接口（API）。
DOM 把 HTML 页面映射为一个多层节点结构。
W3C 制定 DOM 标准。
不同 Web 浏览器对 DOM 标准（DOM1、DOM2、DOM3）的支持情况。

BOM

浏览器对象模型（BOM），支持访问和操作浏览器窗口。

在 HTML 中使用 JavaScript

把 JavaScript 插入到 HTML 页面中需要使用 <script> 元素。

<script> 元素

使用 <script> 元素的两种方式：

直接在页面中嵌入 JavaScript 代码；
包含外部 JavaScript 文件。

异步脚本

// async 属性：异步执行脚本。
// async 属性只适用于外部脚本文件。
// 标记为 async 的脚本并不保证按照指定它们的先后顺序执行。
// 在 XHTML 文档中，要把 async 属性设置为 async="async"。
<script async type="text/javascript" src="指向外部 JavaScript 文件的链接">
</script>

延迟脚本

// defer 属性：延迟到文档完全被解析和显示之后再执行脚本。
// defer 属性只适用于外部脚本文件。
// 在现实当中，存在多个脚本时，延迟脚本并不一定会按照顺序执行，也不一定会在 DOMContentLoaded 事件触发前执行，因此最好只包含一个延迟脚本。
// 在 XHTML 文档中，要把 defer 属性设置为 defer="defer"。
// *** 把延迟执行的脚本放在页面底部仍然是最佳选择。 ***
<script defer type="text/javascript" src="指向外部 JavaScript 文件的链接">
  /* 如果包含了 src 属性，此处就不应该再包含额外的 JavaScript 代码 */
  /* 即使包含了嵌入的代码，浏览器也会忽略嵌入代码 */
</script>

💡

所有 <script> 元素会按照它们在页面中出现的先后顺序依次被解析。所以一般应该把 <script> 元素放在页面最后，<body> 标签之前。

type 属性是可选属性，用于设置脚本语言的内容类型，默认值为 text/javascript 。

CData 片段

可扩展超文本标记语言，即 XHTML（Extensible HyperText Markup Language），是将 HTML 作为 XML 的应用而重新定义的一个标准。编写 XHTML 代码的规则要比编写 HTML 严格得多，而且直接影响能否在嵌入 JavaScript 代码时使用 <script/> 标签。
CData 片段解决的是在 HTML 代码中能正确解析的内容无法被 XHTML 解析的问题。

// CDATA 片段解决方法中出现特殊字符导致解析语法错误
// 很多浏览器不兼容 XHTML，可以把 CDATA 片段加注释解决。
<script type="text/javascript">
//<![CDATA[
    function compare(a, b) {
        if (a < b) {
            alert("A is less than B");
        }else if {
            alert("A is greater than B");
        }else {
            alert("A is equal to B");
        }
    }
//]]>
</script>

💡
将页面的 MIME 类型指定为 “application/xhtml+xml” 可以触发 XHTML 模式，但并不是所有的浏览器都支持以这种方式提供 XHTML 文档。

<noscript> 属性

下列情况下会显示 <noscript> 中的内容：

浏览器不支持脚本；
浏览器支持脚本，但脚本被禁用；

<noscript>
    <p>本页面需要浏览器支持（启用）JavaScript</p>
</noscript>

所有可以用 JavaScript 编写的程序，最终都会出现 JavaScript 的版本。

(Any application that can be written in JavaScript will eventually be written in JavaScript.)

—— Jeff Atwood

独木舟的木

JavaScript 编程：1. 概述

JavaScript 简介

ECMAScript

DOM

BOM

在 HTML 中使用 JavaScript

<script> 元素

异步脚本

延迟脚本

CData 片段

<noscript> 属性