📄 javascr2.htm
字号:
<html>
<head>
<TITLE>JavaScript 第 2 集</TITLE>
<script language="JavaScript">
<!-- Hiding
function hello() {
alert("哈 罗!");
}
function RandomNumber() {
timenow=new Date();
num=Math.abs(Math.sin(timenow.getHours()*timenow.getMinutes()*timenow.getSeconds()));
return num;
}
function WinOpen() {
msg=open("","DisplayWindow","toolbar=no,directories=no,menubar=no");
msg.document.write("<HEAD><TITLE>哈 罗!</TITLE></HEAD>");
msg.document.write("<CENTER><H1>酷 呆 了!</H1><h2>这 是<B>JavaScript</B>所 开 的 视 窗!</h2></CENTER>");
}
// -->
</script>
</head>
<BODY bgcolor="ffffff" link=#ff0000 vlink=#4444dd alink=#9999dd>
<CENTER>
<img src="java.gif" >
</center>
<center>
<FONT SIZE=+2 color=blue>第 2 集</FONT></CENTER>
<p>
<HR WIDTH="80%" ALIGN="center" SIZE="2">
<p>
<br>
<br>
<a name="status"><FONT SIZE="+2" color=green> 范 例 5：</FONT></a><P>
在 这 一 部 分 首 先 要 为 你 展 示 的 JavaScript 特 性 是 将 你 的 滑 鼠 移 到 这 个 不 同 颜 色<P>
的<a href="tpage.htm" onMouseOver="window.status='Just another stupid link...'; return true">连 结</a>上 面， 此 时 看 看 浏 览 器 下 的 状 态 列 有 何 结 果。 然 後 这 样 的 功 能 我 们 可 以<P>
与 JavaScript 的 功 能 相 结 合。 好， 现 在 再 将 你 的 滑 鼠 移 到 本 处 不 同 颜 色 的<a href="" onMouseOver="hello()">连 结</a>上<P>
面， 你 应 该 会 发 现 有 一 个 视 窗 出 现， 是 吧？！ 如 何！ 怎 麽 做 到 的 呢？ 以 下 就 是<P>
这 一 个 连 结 的 作 法：
<pre>
<a href="tpage.htm" onMouseOver="window.status='Just another stupid link...'; return true">
</pre>
在 这 儿 你 只 要 在 传 统 <a> 的 标 签 中 加 入 <I>onMouseOver</I> 的 method， 就 可 达 成 你 要 的<P>
效 果 了。 这 里 的<I> window.status</I> 是 用 来 让 你 可 以 在 WWW 浏 览 器 的 状 态 列 上 显 示<P>
一 些 讯 息 用 的。 在 语 法 中， 你 可 以 看 到 讯 息 部 分 是 用 ' 括 起 来 的 部 分， 而 非 以 " 括<P>
起 来， 在 讯 息 部 分 结 束 之 後， 必 须 加 上 <I>; return true</I>。
<P>
好 了， 利 用 以 上 的 特 性 可 以 很 简 单 的 完 成 第 二 个 连 结 的 例 子！ 相 当 简 单， 以 <P>
<I>onMouseOver</I> 的 method 然 後 配 合 事 件 发 生 时 去 呼 叫 函 数 <i>hello()</i> 就 行 了， 不 再<P>
多 加 解 释 了， 作 法 如 下：
<pre>
<html>
<head>
<script language="LiveScript">
<!-- Hiding
function hello() {
alert("哈 罗!");
}
</script>
</head>
<body>
<a href="" onMouseOver="hello()">link</a>
</body>
</html>
</pre>
<p>
<HR WIDTH="80%" ALIGN="center" SIZE="2">
<P>
<a name="date"><FONT SIZE="+2" color=green> 范 例 6：</FONT></a>
<p>
接 下 来 我 们 要 告 诉 你 一 个 使 用 日 期 和 时 间 的 例 子。 在 第 一 部 分 中， 你 已 看 过 了 <P>
<I>lastModified</I> 的 用 法 和 作 法。 现 在 要 告 诉 你 的 并 非 是 印 出 网 路 上 伺 服 器 或 文 件<P>
修 改 日 期， 而 是 你 个 人 客 户 端 机 器 的 日 期 和 时 间。 以 下 就 是 执 行 结 果：
<br>
<br>
<script language="LiveScript">
<!-- Hiding
today = new Date()
document.write("现 在 时 间 是： ",today.getHours(),":",today.getMinutes())
document.write("<br>今 天 日 期 为： ", today.getMonth()+1,"/",today.getDate(),"/",today.getYear());
// end hiding contents -->
</script>
<p>
做 法 如 下：
<pre>
<script language="LiveScript">
<!-- Hiding
today = new Date()
document.write("现 在 时 间 是： ",today.getHours(),":",today.getMinutes())
document.write("<br>今 天 日 期 为： ", today.getMonth()+1,"/",today.getDate(),"/",today.getYear());
// end hiding contents -->
</script>
</pre>
在 本 例 中， 我 们 必 需 首 先 建 立 一 个 日 期 变 数， 这 可 以 由 <I>today= new Date()</I>来 完 成。<P>
如 果 没 有 特 别 指 定 时 间 与 日 期 的 话， 浏 览 器 将 会 采 用 本 地 客 户 端 机 器 的 时 间， 若 将<P>
它 放 入 变 数 <I>today</I> 中。 这 儿 要 注 意 的 是： 我 们 并 没 有 宣 告 <I>today</I> 这 个 变 数 的 型 态，<P>
这 和 Java 或 其 他 的 程 式 语 言 在 用 到 变 数 之 前 必 需 先 加 以 宣 告 的 方 式 有 相 当 大 的 不<P>
同。 在 完 成<I> today</I> 的 日 期 变 数 後， 我 们 等 於 建 立 了 一 个 具 有 本 地 时 间 与 日 期 的 物 件<P>
(object)。 接 着 就 可 以 使 用 <I>get... </I> 的 method 以 取 得<I> today</I> 这 个 物 件 的 时 间 和 日 期。<P>
请 注 意 <I>getMonth</I> 这 个 method 所 取 得 的 月 份 范 围 是 由 0~11， 所 以 必 须 加 1 以 代<P>
表 真 正 的 1 月 至 12 月。 看 完 以 上 的 例 子 後， 想 想 你 可 以 使 你 的 文 件 变 得 有 点<P>
智 慧， 例 如： 某 个 文 件 有 时 效 限 制 的 话， 你 可 以 利 用 我 们 在 上 一 部 份 的<A HREF="javascr.htm#ex4">范 例 4</A><P>
中 所 提 到 的 功 能 和 这 一 个 范 例 中 所 学 习 到 的 功 能， 设 计 一 个 让 你 的 文 件 在 第10天<P>
以 後 读 到 的 话 就 会 告 诉 读 者："喂！ 这 篇 已 过 时 了！"的 程 式， 试 试 看， 并 不 难！<P>
<br>
除 以 上 功 能 外， 在 建 立 日 期 物 件 时 你 也 可 以 事 先 设 定 日 期 如 下：<P>
<CENTER><I>docStarted= new Date(96,0,13)</I></CENTER><P>
首 先 是 年（西 元）， 接 着 是 月（但 记 得 减 1）， 再 接 着 是 日。 同 样 的 方 法 也 可 以<P>
加 上 时 间 的 设 定， 如 下：<P>
<CENTER><I>docStarted = new Date(96,0,13,10,50,0)</I></CENTER><P>
前 三 个 是 日 期 的 年、 月、 日， 接 着 是 时、 分、 秒。 最 後， 我 们 必 须 提 醒 你，<P>
JavaScript 并 没 有 实 际 的 日 期 型 态， 但 是 它 却 能 毫 不 费 力 地 显 示 出 日 期 和 时 间，<P>
原 因 是 它 是 从 1 / 1 / 1970 0：0h 开 始 以 ms(milli seconds) 来 计 算 目 前 的 时 间 的，<P>
这 听 起 来 似 有 些 复 杂， 但 你 倒 不 用 担 心， 它 有 标 准 的 共 用 函 数 可 以 计 算，<P>
你 只 要 知 道 如 何 用 就 可 以 了！
<br>
<p>
<HR WIDTH="80%" ALIGN="center" SIZE="2">
<P>
<a name="random"><FONT SIZE="+2" color=green> 范 例 7：</FONT></a>
<p>
接 下 来 我 们 要 为 你 介 绍 一 个 可 以 产 生 乱 数 的 函 数， 也 是 以 JavaScript 所 写 的。<P>
这 个 函 数 只 是 利 用 了 一 点 小 技 巧 而 已， 而 这 种 技 巧 在 大 部 分 的 编 译 器(compiler)中，<P>
大 都 是 如 此（或 类 似） 计 算 出 乱 数 来 的。 我 相 信 JavaScript 最 後 应 也 会 以 相 似 的 方<P>
法 来 产 生 这 样 的 method ， 如 果 它 会 提 供 这 样 功 能 的 话。 以 下 是 此 函 数 的 结 果：
<p>
这 是 一 个 计 算 产 生 的 乱 数：
<script language="LiveScript">
<!--
document.write(RandomNumber());
// -->
</script>
<p>
以 下 是 这 个 作 法 的 写 法：
<pre>
<html>
<head>
<script language="LiveScript">
function RandomNumber() {
today = new Date();
num = Math.abs(Math.sin(today.getTime()));
return num;
}
</script>
</head>
<body>
<script language="LiveScript">
<!--
document.write("This is a random number:", RandomNumber());
// -->
</script>
</body>
</html>
</pre>
<p>
我 们 的 做 法 是 以 上 一 个 范 例 中 的 时 间 函 数； 它 会 出 现 一 个 很 大 的 数，<P>
利 用 这 个 数 再 加 以 运 算 即 可！ 例 如： 将 它 拿 来 做 正 弦 函 数（sin） 的 运<P>
算， 得 到 的 数 再 做 绝 对 值 的 运 算， 结 果 可 以 得 到 一 个 介 於 0 与 1 间 的<P>
实 数。 因 为 时 间 的 改 变 是 ms 为 单 位， 而 且 你 绝 不 会 获 得 相 同 的 数 字。<P>
不 过 这 个 做 法 并 不 适 合 拿 来 快 速 的 连 续 产 生 一 系 列 的 乱 数， 但 如 果 你<P>
是 不 定 时， 久 久 的 用 一 次， 那 效 果 就 不 错 了！
<p>
<HR WIDTH="80%" ALIGN="center" SIZE="2">
<P>
<a name="win"><FONT SIZE="+2" color=green> 范 例 8：</FONT></a>
<p>
JavaScript 的 一 个 重 要 特 点 是 它 可 以 制 作 视 窗。 你 可 以 产 生 一 个 的 视 窗， 并 且<P>
在 此 视 窗 中 载 入 HTML 文 件， 完 全 以 JavaScript 来 航 游 网 际 网 路（Internet ）。<P>
接 下 来 的 范 例 就 是 告 诉 你 如 何 开 启 一 个 视 窗 并 且 写 点 东 西 进 去， 你 可 先 试 试<P>
按 一 下 范 中 之 接 钮 看 看！
<p>
<form>
<input type="button" name="Button1" value="Push me" onclick="WinOpen()">
</form>
<p>
原 始 程 式 如 下：
<pre>
<html>
<head>
<script language="LiveScript">
function WinOpen() {
msg=open("","DisplayWindow","toolbar=no,directories=no,menubar=no");
msg.document.write("<HEAD><TITLE>哈 罗!</TITLE></HEAD>");
msg.document.write("<CENTER><H1>酷 毙 了!</H1><h2>这 是<B>JavaScript</B>所 开 的 视 窗!</h2></CENTER>");
}
</script>
</head>
<body>
<form>
<input type="button" name="Button1" value="Push me" onclick="WinOpen()">
</form>
</body>
</html>
</pre>
这 儿 你 又 看 到 用 按 钮 来 启 动 函 数。 这 次 的 函 数 <I>WinOpen()</I>是 藉 着 一 个 <I>open</I><P>
的 method 来 产 生 一 个 新 的 视 窗。 第 一 对 双 引 号("")是 用 来 描 述 欲 载 入 至 视 窗<P>
中 的 文 件 URL 位 置。 如 果 留 者 空 白 的 话， 那 就 会 呈 现 一 个 空 白 视 窗， 并 可 以<P>
透 过 JavaScript 写 入 东 西！ 下 一 对 双 引 号 内 的 内 容 是 这 个 新 开 启 视 窗 的 名 字，<P>
你 可 以 喜 欢 给 它 任 意 一 个 名 字， 但 不 可 加 入 空 白， 如 用<I> Display Window </I>的 话 便<P>
会 出 现 错 误 讯 息， 请 注 意。 接 下 来 的 一 连 串 双 引 号 内 所 指 定 的 是 该 视 窗<P>
的 相 关 性 质(properties)， 这 些 蛮 有 趣 的， 你 可 以 指 定 要 不 要 有 工 具 棒(toolbar) 、<P>
卷 轴(scrollbar)， 等 等， 例 如： 如 果 你 写 <I>toolbar = yes</I>， 那 就 会 在 你 所 产 生 出<P>
来 的 视 窗 中 出 现 一 排 工 具 列。 以 下 有 许 多 你 可 以 改 变 的 视 窗 特 性， 请 注 意 它 们<P>
字 中 间 不 可 以 有 空 白：
<p>
toolbar<br>
location<br>
directories<br>
status<br>
menubar<br>
scrollbars<br>
resizable<br>
copyhistory<br>
width=<i>pixels</i><br>
height=<i>pixels</i><br>
<p>
以 上 的<I> pixels</I> 部 分， 你 可 以 填 入 点 数 的 数 值， 这 数 值 是 告 诉 浏 览 器 这 个 视 窗 的<P>
大 小。 在 开 启 视 窗， 并 且 将 它 称 为 <I>msg</I> 以 後， 就 可 以 开 始 写 些 东 西 到 视 窗 中 了。<P>
你 可 以 写 入 一 般 正 规 的 HTML 语 法 文 字。 哇！ 这 可 不 得 了 了， 也 就 是 说， 你 可 以<P>
利 用 先 前 使 用 者 在 form 表 格 中 输 入 给 你 的 文 章 直 接 将 它 回 应 至 浏 览 器 上 来 了！ 这 些<P>
功 能 在 几 个 月 前 大 概 还 只 能 用 CGI 才 能 达 到 喔！ 现 在 你 不 用 CGI 也 可 以 做 了！<P>
<P>
<HR WIDTH="80%" ALIGN="center" SIZE="3"><P>
<CENTER><a href="index.htm" TARGET=_top>回 主 目 录</a></CENTER><P>
<HR WIDTH="80%" ALIGN="center" SIZE="2">
<p>
<CENTER>希 你 能 对 我 们 的 介 绍 感 到 还 算 不 错。 由 於 JavaScript 尚 未 完 全 发 展 完 成，<P>
并 且 很 可 能 会 再 继 续 地 做 一 些 更 动， 希 这 儿 的 范 例 到 时 都 还 能 执 行， 在<P>
JavaScript 更 多 特 性 完 成 後， 我 们 也 会 继 续 地 再 为 你 介 绍 一 些 新 的 范 例 的！</CENTER>
<br><P>
<HR WIDTH="80%" ALIGN="center" SIZE="3">
<P>
本章编译：<A HREF="mailto://cbc@it.ntc.edu.tw">钱 炳 全</A> <BR>
</body>
</html>
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -