第 一 部 分： 简 介
什 么 是 JavaScript
JavaScript 是 一 种 新 的 描 述 性 语 言， 它 是 由 Netscape 开 发 的。 通 过 使 用 JavaScript 你 可 以 非 常 容 易 的 开 发 出 交 互 式 的 web 页。 这 个 教 程 会 告 诉 你， 你 能 用 JavaScript 作 什 么， 而 且 更 重 要 的 是 它 能 告 诉 你 怎 么 去 作。
许 多 人 认 为 JavaScript 是 Java ， 只 是 因 为 它 们 有 相 近 的 名
字。 这 并 不 正 确。 我 想 现 在 就 告 诉 你 它 们 的 区 别 还 太
早， 所 以， 现 在 你 只 需 记 住， JavaScript 并 不 是 Java。
如 果 需 要 讲 一 步 的 信 息， 请 到 Netscape
（Netscape 有 一 个700k 的 关 于javascript1.1 的zip 文 档， 我 会 把 它 弄
上 我 的 主 页， 翻 译 恐 怕 就 不 行 了:-)）
需 要 些 什 么 来 运 行 JavaScript 的 描 述 语 言 呢? 你 只 需 一 个
能 运 行 JavaScript 语 言 的 浏 览 器： 比 方 说 Netscape Navigator ( 2.0 版
以 上) 或 者 是 Microsoft Internet Explorer (MSIE - 3.0 版 以 上)。 现 在 几
乎 所 有 的 人 都 在 用 这 两 种 浏 览 器， 所 以 大 部 分 的 人 可
以 看 到 JavaScript 描 述 语 言 的 效 果。 这 对 于 挑 选 JavaScript 作
基 于 web 页 的 开 发 很 重 要。
当 然 在 阅 读 本 教 程 时， 你 需 要 有 基 本 的 HTML 知 识。 网 上
能 找 到 很 多 关 于 HTML 的 资 料。 用 HTML 作 关 键 词 在 Yahoo 作 搜 索， 你 能 找 到 很 多 关 于
HTML 的 资 料。
JavaScript 代 码 是 直 接 加 入 在 HTML 页 中 的。 下 面 有 一 个 简
单 的 例 子:
<html>
<body>
<br>
This is a normal HTML document.
<br>
<script language="JavaScript">
document.write("This is JavaScript!")
</script>
<br>
Back in HTML again.
</body>
</html>
粗 粗 一 看， 这 只 是 一 个 普 通 的 HTML 文 件。 唯 一 不 同 的
只 是 这 一 部 分:
<script language="JavaScript">
document.write("This is JavaScript!")
</script>
这 就 是 JavaScript。 你 可 以 把 这 段 代 码 作 为 一 个 普 通 的
HTML 文 件 存 盘， 然 后 在 你 的 支 持 JavaScript 的 浏 览 器 中 打
开， 看 看 效 果 如 何。
这 儿 是 输 出 效 果( 如 果 使 用 支 持 JavaScript 的 浏 览 器 你 会
看 到 三 行 输 出 ):
This is a normal HTML document.
Back in HTML again.
我 必 须 指 出 这 段 代 码 并 不 十 分 有 用 - 使 用HTML 代 码 来 写 会 更 容 易。 我 只 是 想 示 范 <script> 标 记 符。 任 何 在 <script> 和 </script> 标 记 符 之 间 的 都 被 认 为 是 JavaScript 代 码。 你 已 经 看 到 了 document.write() 的 应 用 - 这 是 JavaScript 编 程 中 最 有 用 的 命 令 之 一。 document.write() 是 用 来 向 实 际 的 文 本 中 写 点 儿 东 西( 在 这 儿 是 HTML 文 本)。 结 果 我 们 的 小 JavaScript 程 序 在 这 个 HTML 文 本 中 写 了 This is JavaScript!。
如 果 浏 览 器 不 支 持 JavaScript， 那 我 们 的web 页 看 起 来 会 是 什 么 样 的 呢? 一 个 不 支 持 JavaScript 的 浏 览 器 不 “认 识” <script> 标 记 符。 它 会 忽 略 这 个 标 记 符， 把 后 面 的 代 码 作 为 普 通 的 文 本 输 出。 这 就 是 说 用 户 能 在 web 页 中 看 到 我 们 编 写 的 JavaScript 代 码。 我 们 不 愿 意 这 么 做。 有 一 个 方 法 可 以 在 “老” 浏 览 器 中“ 隐 藏” 这 些 代 码。 只 需 使 用 HTML 注 解 符 <!-- -->. 我 们 新 的 源 代 码 是 这 样 的:
<html>
<body>
<br>
This is a normal HTML document.
<br>
<script language="JavaScript">
<!-- hide from old browsers
document.write("This is JavaScript!")
// -->
</script>
<br>
Back in HTML again.
</body>
</html>
在 不 支 持 JavaScript 的 浏 览 器 中， 看 起 来 是 这 样 的:
This is a normal HTML document.
Back in HTML again.
在 不 支 持 Javascript 的 浏 览 器 中， 不 使 用 HTML 注 解 符 的 输 出 是 这 样 的:
This is a normal HTML document.
document.write("This is JavaScript!")
Back in HTML again.
请 记 住， 你 不 能 完 全 “隐 藏”Javascript 源 代 码。 我 们 在 这 儿 所 作 的 只 是 防 止 代 码 的 输 出 - 但 用 户 仍 然 可 以 通 过 使 用“View document source” 命 令 来 看 到 它。 没 有 办 法 防 止 别 人 看 到 你 的 源 代 码 ( 为 了 看 到 一 种 效 果 是 如 何 作 出 来 的)。
事 件 和 事 件 处 理 器 在 JavaScript 编 程 中 是 非 常 重 要 的。
用 户 的 操 作 会 引 发 事 件。 如 果 用 户 按 下（click) 一 个 键，
那 么 一 个 Click 事 件 发 生 了。 如 果 鼠 标 移 到 一 个 连 接
上， 那 么 一 个 MouseOver 事 件 发 生 了。Javascript 中 有 很 多 不 同
的 事 件。
我 们 想 要 我 们 的 JavaScript 程 序 对 特 定 的 事 件 作 出 反 应。
这 就 需 要 用 到 事 件 处 理 器。 当 按 下 一 个 键 时 会 弹 出 一
个 窗 口。 这 就 意 味 着 对Click 事 件 的 反 应 是 弹 出 一 个 窗
口。 对 这 个 事 件 的 处 理 我 们 就 需 要onClick 事 件 处 理 器。
它 告 诉 计 算 机 当 事 件 发 生 时 如 何 来 处 理 这 个 事 件。 以
下 的 代 码 是onClick 事 件 处 理 器 的 一 个 简 单 例 子:
<form>
<input type="button" value="Click me" onClick="alert(' 大 家
好')">
</form>
在 这 段 代 码 中 有 一 些 新 的 东 西－ 让 我 们 一 步 一 步 的
学。 在 这 儿 我 们 用 form 代 码 生 成 了 一 个 键 ( 这 是 一 个 基
本 的 HTML 问 题， 我 不 想 在 这 儿 作 深 入 讨 论 )。 新 的 部 分
是 在 <input> 符 号 中 的 onClick="alert(' 大 家 好')"。
我 们 前 面 已 经 说 过， 这 部 分 定 义 了 当 键 被 按 下 时 会 发
生 什 么。 所 以 当 Click 事 件 发 生 时， 计 算 机 会 运 行alert('Yo')。
这 是JavaScript 代 码( 请 记 住 在 这 儿 我 们 没 有 用 <script> 符
号 )。
alert() 让 你 生 成 一 个 弹 出 窗 口。 在 括 号 内 你 必 须 填 入 一
个 字 符 串。 在 这 儿 我 们 填 入 的 是 ' 大 家 好 '. 这 是 显 示
在 弹 出 窗 口 中 的 文 字。 所 以 当 用 户 按 下 那 个 键 时， 我
们 的 代 码 生 成 了 一 个 写 着' 大 家 好 ' 的 窗 口。
这 里 有 一 点 也 许 会 令 人 迷 惑: 在 document.write() 命 令 中 我 们
用 了 双 引 号 " ， 而 在 alert() 中 我 们 用 的 是 单 引 号 ' - 为
什 么 ? 一 般 来 说 两 者 都 能 用， 但 在 我 们 的 例 子 中， 是
这 样 写 的 onClick="alert('Yo')" - 你 能 看 到 在 这 儿 我
们 既 用 了 单 引 号， 又 用 了 双 引 号。 如 果 我 们 这 样 写 onClick="alert("Yo")"
计 算 机 会 分 不 清， 哪 一 部 分 属 于 onClick 事 件 处 理 器， 而
哪 一 部 分 不 是。 所 以 在 这 儿 你 必 须 轮 流 使 用 单 引 号 和
双 引 号， 但 与 次 序 无 关－ 先 用 双 引 号， 再 用 单 引 号 或
反 过 来 都 可 以。 这 意 味 着 你 也 可 以 这 样 写 onClick='alert("Yo")'。
在Javascript 语 言 中 有 许 多 不 同 所 事 件 控 制 器 可 供 使 用。 在 这 个 教 程 中 我 我 们 会 学 到 一 些， 但 不 是 全 部。 所 以 如 果 你 想 学 到 多 的 关 于 事 件 处 理 器 的 内 容 请 参 照 Netscape 的 详 细 指 南?
如 果 你 使 用 Netscape Navigator 浏 览 器， 那 这 个 弹 出 窗 口 会 包 含 JavaScript alert。 这 是 基 于 安 全 性 考 虑： 因 为 你 也 可 以 用 prompt() 来 生 成 一 个 相 近 的 窗 口。 这 个 窗 口 可 以 接 受 输 入。 所 以 一 个 别 有 用 心 的 人 可 以 利 用 这 样 的 代 码 来 模 拟 生 成 一 个 输 入 窗 口， 向 用 户 骗 取 口 令。 弹 出 窗 口 中 这 样 的 文 字 表 明 这 个 输 入 要 求 来 自 浏 览 器， 而 非 来 自 于 系 统。 这 是 一 个 你 无 法 除 去 的 安 全 性 限 制。
在 大 部 分 JavaScript 程 序 中 都 要 用 到 函 数。 所 以 现 在 我
们 就 来 谈 谈 这 个 非 常 重 要 的 概 念。
对 函 数 最 简 单 的 理 解， 可 以 把 它 看 作 一 串 命 令 的 集
合。 让 我 们 先 来 看 一 个 例 子： 它 把 特 定 的 文 字 输 出 三
次。
<html>
<script language="JavaScript">
<!-- hide
document.write(" 欢 迎 来 到 我 的 主 页 !<br>");
document.write(" 这 是 JavaScript !<br>");
document.write(" 欢 迎 来 到 我 的 主 页 !<br>");
document.write(" 这 是 JavaScript !<br>");
document.write(" 欢 迎 来 到 我 的 主 页 !<br>");
document.write(" 这 是 JavaScript !<br>");
// -->
</script>
</html>
它 会 把 这 段 文 字
欢 迎 来 到 我 的 主 页!
这 是 JavaScript !
输 出 三 次。 让 我 们 来 看 看 源 代 码－ 把 这 段 代 码 写 三 次， 它 就 输 出 三 次。 这 就 够 了 吗？ 不， 让 我 们 把 它 改 一 下。 这 样 如 何 呢：
<html>
<script language="JavaScript">
<!-- hide
function myFunction() {
document.write(" 欢 迎 来 到 我 的 主 页 !<br>");
document.write(" 这 是 JavaScript !<br>");
}
myFunction();
myFunction();
myFunction();
// -->
</script>
</html>
在 这 段 代 码 中， 我 们 定 义 了 一 个 函 数。 这 个 函 数 是 通 过 下 面 这 几 行 定 义 的：
function myFunction() {
document.write(" 欢 迎 来 到 我 的 主 页 !<br>");
document.write(" 这 是 JavaScript !<br>");
}
在 {} 中 的 命 令 是 属 于 函 数 myFunction() 的。 这 意 味 着 我 们
的 两 条 document.write() 命 令 集 合 在 了 一 起， 能 通 过 函 数 调
用 来 运 行 它 们。 在 我 们 的 例 子 中， 我 们 对 该 函 数 作 了
三 次 调 用， 我 们 看 到 在 函 数 定 义 下 面， 写 了 三 次
myFunction()。 这 就 是 三 次 函 数 调 用。 这 意 味 着， 函 数 中 的
命 令 被 运 行 了 三 次。
这 是 关 于 函 数 的 一 个 非 常 简 单 的 例 子。 也 许， 你 会 想
为 什 么 函 数 这 么 重 要。 在 读 完 这 个 教 程 后， 你 会 发 现
函 数 的 重 要 性。
函 数 能 和 事 件 处 理 器 综 合 使 用。 看 看 下 面 这 个 例 子：
<html>
<head>
<script language="JavaScript">
<!-- hide
function calculation() {
var x= 12;
var y= 5;
var result= x + y;
alert(result);
}
// -->
</script>
</head>
<body>
<form>
<input type="button" value=" 计 算 "
onClick="calculation()">
</form>
</body>
</html>
这 儿 你 能 测 试 一 下 这 个 例 子：
这 个 键 调 用 了 函 数 calculate()。 你 能 看 到 这 个 函 数 作 了 一 些 计 算 工 作。 我 们 通 过 使 用 变 量 x, y 和 result 来 完 成 这 个 计 算。 我 们 通 过 使 用 关 键 词 var 来 定 义 变 量。 不 同 的 变 量 能 储 存 不 同 的 常 量， 象 数 字， 字 符 串 等。 var result= x + y; 告 诉 计 算 机 生 成 一 个 变 量 result ， 并 把 x + y ( 象 5 + 12) 的 计 算 结 果 储 存 在 里 面。 经 过 计 算 后 result 的 值 是 17。 命 令 alert(result) 在 这 儿 同 使 用 alert(17) 是 一 样 的。 这 意 味 着， 我 们 生 成 一 个 内 容 是 数 字 17 的 弹 出 窗 口。