📄 javascr2.html
字号:
<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.html#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.html" 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 + -