JavaScript 入門[java 園地]
摘要 | By Rawn Shah | 另一個 Java? |
Java-lite | 那它能做到什麼? | 語法 |
保留字及運算子 | 資料型別和變數 | 敘述 |
if...else | while | for..in |
function | break,continue | 物件的使用 |
JavaScript 物件之說明 | 事件處理者(Event Handler) | 使用 JavaScript 的範例 |
JavaScript 提供一些簡單有效的方法來改善你 Web 站台的風格。目前我們會假設我們
都是初學者,並朝著專業程式設計者的水準邁進。
如果你已經看遍 Java 世界為 Web 帶來的新奇事物,但 卻害怕去學一個如此複雜的語
言的話,你應該要考慮一下 JavaScript,它是 Sun 和 Netscape 所共同努力下的產 品。
Netscape 公司在它 2.0 版的瀏覽器眾多的特色 裡,有一項就是客戶端的劇本執行功能
(client-side scripting)。它一開始被稱為 LiveScript,後來又更 名為 JavaScript。這個
語言是 Netscape 和 Sun 的 Java 計劃衍生產品。在它尚未公諸於世之之前,Sun 的
Java 小組成員把這個劇本系統(scripting system)形容作 『一個可以快速撰寫短小而
且實用的劇本以及方塊(applet)的方 法。』Netscape 去年十二月間對它的注意帶來了
一群全 新的開發夥伴來為新的版本發展方塊以及應用程式。 在 JavaWorld 的創刊號
裡,我們將以簡短的一系列文章 把 JavaScript 的技術面以及功能引介給初學者們。由
於我不希望會走之前就去學飛,我會先將這個語言 最基本的部分以及它的架構先瀏
覽過一遍。我們會先實作 一些非常簡單的範例,這樣一來你可以把它們加進你的 首
頁裡,將來的文章裡我們再嘗試一些較有趣的大程式。
相對於有些人所相信的,JavaScript 並不只是 給初學者和新手使用的 Java 去咖啡因版
本。這隻 LiveScript/ JavaScript 怪獸和 Java 方塊以及應用程式相當地不同。 。它提供
了另一種市場區隔所需的功能,主要是 Netscape Navigator 2.0 的客戶端 API。 雖然伺
服端 API 曾經在 Web 世界裡取得優勢,有關客 戶端 API 使用的討論依然在進行中。
隨著用戶端桌上型 電腦軟硬體技術的進步,慢慢有人努力想將應用程式的 處理從已
經忙碌不堪的伺服器轉移到使用者介面端。 在 486 昇級到 Pentium 以及 68000 系列昇
級到 PowerPC 的使用者慢慢增加,還有記憶體和次級儲存體(secodnary storage)的
價格滑落的趨勢下,一般使用者在技術方面的 需求也隨之提昇。 JavaScript 提供了一
套客戶端 API 來處理 Web 討厭的 靜態文字。Netscape 也在研擬用 JavaScript 開發 伺
服端的系統,或許會連接 CGI 以達到向後相容性。 在現在所有的 Netscape 2.0 beta 版
中都有支援這個功 能,也都能在不同的平台上執行。不過麥金塔的使用者 要注意,
麥金塔的瀏覽器能夠支援 JavaScript 並不表示 它就能執行 Java 方塊。Netscape 2.0 的
麥金塔版和 Windows 3.1 版目前尚未支援 Java。
早期被稱為 Java-lite 或是摩卡的 JavaScript 去掉了 為了要作簡單的計算或是瀏覽器控
制功能,卻要寫 繁雜的 Java 方塊的一些細節。二者間最顯著的不同 就是 JavaScript
是由瀏覽器從原始碼直接解譯,而 Java 方塊在使用之前卻必須先編譯成類別。對非
專業人士來 說,這意謂著這些 script 會執行得慢些;它每一行必 須分別解譯,通常
是一次組合一個關鍵字和參數,而不 是用編譯過較快的碼,可以讓瀏覽器內的 Java
執行時 期環境直接執行。 雖然必須放棄一些 Java 的物件導向特性,你還是可以 擁有
物件以及它們的方法和變數來提供你所需的功能。 你可以定義物件,但不是物件的
類別。用通俗的話來說, 一個物件和一個類別的不同就像建築物和藍圖的不同。 有
了一棟建築物後,你可以一直用到它毀壞為止,但如 果你有藍圖的話,你可以再建
一棟和它一樣的建築物或 是在上面作一些修改。 你也必須放棄物件的繼承。在我們
建築物的例子裡,有 了類別和繼承的話,你可以有效地修改藍圖來建一棟更 好的建
築物,或是一棟更適合它用途的建築物。類別和 繼承的存在可以讓物件的功能和重
用性更為方便使用和 改進。在短小的 script 中,你可能不會太常重用一個 物件,所
以這個功能並非真的很需要。 JavaScript 也提供較鬆散的型別宣告給懶人使用。傳統
的 C、Pascal,甚至是 Java 世界的程式設計者已經習 於強型別的宣告。你必須指定一
個變數是字串、整數等 等的。JavaScript 就像 Perl 一樣,只要在需要的時候 使用你要
用的變數,只要記得不要突然把字串換成 整數或是布林型態就好了。這個寬鬆的因
素有部份是由 於設計者不希望使用者描述程式太瑣碎的細節。簡單的 script 在執行
時,沒有強型別的宣告它存活下來的機會 比較大。 Java 方塊通常並不和首頁的
HTML 溝通,每一個方塊都 侷限於首頁的一個子區域。雖然一個方塊可以和其他幾
個 同一頁裡的方塊溝通,然而它卻不能改變所在首頁的文字 。另一方面來說,
JavaScript 就只是創造來使 HTML 的 作者可以使不同的 HTML 標籤以及元素間互動。
一個 HTML form 內的輸入盒可以去修改另一個 HTML 頁內的資訊。 老實說,實際上
還是有一些方法可以從 Java 方塊內去控 制瀏覽器。然而,就算要作一些簡單的事像
是在 form 裡作計算,改變瀏覽器內另一個 frame 的內容等等的, 卻也要花可觀的時
間去為一件簡單的事寫程式。JavaScript 讓 HTML 的作者不用花一個又一個小時去寫
Java 程式 就能作到這些功能。 雖然沒有明講,但另一個不同點就是你沒有 Java 大量
的類別庫可用了。這限制了 script 只能作簡單的計算 和事件的處理。舉例來說,你不
能在 JavaScript 裡建 立另一個網路連線,並從網路上下傳一個新的類別加入 你的類別
體系裡以動態地增強瀏覽器的基本功能。但這 卻是 Java 可以做到的。
現在你已經知道它是什麼以及為什麼我們要用它之後, 我們繼續進行下一個主題來
說明何時以及如何用它。如 前文所提,JavaScript 可以更有效的方式來傳送 Web 互動
式的表格(form)。以前我們用伺服端的 script 來做的時候,程式設計者必須要撰寫
一整套的表格和 script,或是在同一個 script 中用好幾個步驟才能達 到錯誤檢查與更
正。有了 JavaScript,錯誤檢查可以 內建的事件處理機制來迅速地處理使用者與 Web
表格 間的互動。有了 JavaScript,你也可以根據 HTML 的 checkbox、radio 鍵或是輸入
欄填入的資料來建立動 態的表格,改變使用者螢幕上的顯示。 JavaScript 也可以寫點
小程式,用來處理那些原本以 伺服端的 script 來做會很吃力的一些簡單的功能或計
算。對於不能直接存取或控制伺服端以開發伺服端 script 的使用者來說,這更省下很
多時間。Netscape 2.0 用於表格中的 HTML 標籤,如 FORM、INPUT 和 TEXTAREA,
都已經被“致能“,以接受滑鼠按鍵、焦點, 和輸入文字等事件驅動的動作,來呼
叫文件內的 script。 Netscape 還加進了一個新的標籤叫 SCRIPT。所有在開 始和結束
的 script 標籤之間的文字都會被認為是 JavaScript。 這一組標籤可以放在 HTML 檔的
BODY 區內,或是 HEAD 區內。放在 HEAD 區內的話,裡頭的程式碼會在整個
HTML 頁傳下來之前就執行完成。這使得所有程式碼都能在使用 者在表格內輸入任
何文字前完成,事件也才能妥善處理。 舉例來說,或許你想要在首頁中加入 script,
以建立 一個動態的表格,並根據前面提到的一些表格元素內所接 收到的訊息來顯示
對應的標籤或 HTML 碼。 script 並不一定要和 HTML 檔放在一起。它可以放在其 他
位置並從 HTML 檔下傳,就像影像檔一樣。不幸的是, 由於此功能 Netscape 尚在發
展當中,在本文付梓時(使 用的是 2.0 Beta 6)尚無法測試。 我們第一個 JavaScript
的範例展示了將程式碼直接加在 SCRIPT 標籤之後的例子: <HTML> <HEAD>
<TITLE>My First JavaScript Page</TITLE> <SCRIPT LANGUAGE="Javascript"> <!--
document.write("This text will appear before the actual body of the HTML page. <P>"); // -->
</SCRIPT> </HEAD> <BODY> <H3> This is my first JavaScript Web page! </H3> </BODY>
</HTML> 檢視了上面的 HTML 碼之後,你可能會發現有些東西第 一眼看到有點特
別。例如說,HTML 註解的標籤“
若你看過 C、C++或是 Java 的程式,大概會滿熟悉 JavaScript 的語法。這個語言有一
套保留字扮演語言的控制機制。此外, 還有一套內建函數用來完成一些功能如列印
一段文字、數學 運算等。你也可以自定變數,用來儲存資料以供日後修改及 使
用。JavaScript 只使用到少數的一些原始資料型別。 基本上,雖然你可以用數百行
長、緊密結合的指令來完成整 個程式,但大部份的程式設計者都會將程式碼分成好
幾段。 這一小段一小段的程式碼可以讓你只要呼叫一個函數就能完 成一組指令,省
下每次都要重寫相同程式碼的時間。JavaScript 把函數內的一段指令視為可執的單一
單元,其內部為完成這 個函數所需的 JavaScript。函數內的程式碼只有當函數被 呼叫
時才會執行。
JavaScript 使用了大量的 ASCII 字元集內非英文字母的字 元作為運算子,這些運算子
可以完成特定的單純數學及邏輯 運算。一個運算子通常伴隨著另兩個元素:lvalue
(運算子 左邊的值)和 rvalue(運算子右邊的值)。C 和 C++ 的使 用者會很樂於知
道 JavaScript 的運算子和他們所用的幾乎 是相同的集合。 基本的數學運算子有 +(加
號),-(減號或負號),*(乘號) ,/(除號),%(除數)和 =(等於);附帶一
點,等號的 lvalue 必須是變數。除了上述運算子外,還有 --(整數遞 減),++(整數
遞加),和位元運算子如 ||(兩變數 OR 值) ,&&(兩變數 AND 值),!(變數的
NOT 值),^(兩變數的 XOR 值),<<(左移一位元),<<<(左移一位元並將空元
填 零),>>(右移一位元),>>>(右移一位元並將空白填零)。 除了遞加、遞減和
算數的負號外,上述的運算子尚能與 = 結 合成 +=(將 lvalue 加上 rvalue 的值)。這
種與 = 結合的運算子可做為將變數做數學運算後再把結果指定給該 變數時一個方便
的速記方式: variable = variable * 42; // 上列敘述等於 variable *= 42; 要作複雜運算的
話,可以將算式的每個耜份用括號括起來: zzz = (xxx * 32) / (yyy + xxx); 邏輯或數值
比較的運算子如下:<(小於),>(大於),== (等於),!=(不等於),<=(小於
或等於),>=(大於或 等於)。注意 == 和 = 的不同,這是 C 和 JavaScript 的 新手常
會犯的錯誤。BASIC 的使用者也要知道『不等於』是 用 != 而不是 <>。行尾的分號是
用來將程式碼分行。你也可 以將好幾段可執行的碼寫在同一行裡,這兩者是相同
的,只 是後者較節省空間。例如: variable *= 42; zzz = (xxx * 32) / (yyy + xxx); 加號
(+)除了當數學的加號外,若其 lvalue 和 rvalue 都是字串的話,它也可以把兩字串
連接起來。如: yourname = "Dave" line_of_text = "What are you doing" + yourname + "?";
變數 line_of_text 則成為 "What are you doing Dave?" 引號是用來表示字串,單引號也有
相同的功能。你必須用一 對引號來標出字串的開頭及結尾。這兩者間的不同在於標
準 的雙引號(")可以用特殊字元的組合來表示不可列印的 ASCII 字元如 tab,
newline 等。要表示這些 meta-character 可以用倒斜線(\)。例如 tab 用 \t 表示。倒斜
線也可以 表示一些會被誤解的跳脫字元。要印出倒斜線的話,可以在 字串中可以用
兩個倒斜線(\\)表示。 中括號是用在一種稱為陣列的特殊資料形態中。陣列是一組
可以直接取出,且型別相同的值。例如說,要存取陣列中的 第一個元素可以用
myarray[0]。注意陣列是由 0 而不是 1 開始。我們之後會再深入探討陣列。大括號({
和 })是用 來表示一個敘述的區塊。這些區塊可用在一些常見的語言結 構如
if...then...else 和 while 迴圈,以及標出函數的 邊界。 註解是用 /* 和 */ 標出來,或者
也可以用 // 來表示之到 直到行尾的字元都是註解。最後我們要介紹的這個運算子用
到兩個字元,問號(?)和冒號(:)。?: 運算子是 if... then...else 的速記。同樣的敘述
亦可用 if 和 else 這兩 個保留字來表示,如: if (notMine == true) { someoneElses =
true; } else { someoneElses = false; } 可以很容易改寫成: someoneElses = (notMine ==
true) ? true : false; 最後,C 和 C++ 的使用者要記得沒有 * 和 -> 這兩個運算 子。Perl 的
使用者也要知道錢號($)不是用來表示變數, 井字號(#)也不是表示註解的開
始。Perl 的使用者也會很 喪氣地發現並沒有樣本比對(pattern-matching)和取代(
substitution)的運算子。
JavaScript 有四種基本的資料型別:物件(object,可以是 任何型別的通用資料型別)
,數值(number,浮點數或十進 位數),字串(string,一串字元)和 布林變數
(boolean, true 或 false)。變數是用一個名稱表示,大小寫不同。變 數名除了底線
(_)外,不可用其他非 ASCII 字母及數字的 字元。還有,變數名的第一個字元只能
用字母,不能用數字 或是底線。下面幾個範例說明了幾個被指定值的變數。
myvariable = "A line of text "; count = 0; Super_Long_VariableNamethatishardtoread = "";
WorldIsRound = true; 第一個變數是字串。第二個變數是數值,而第三個變數是另 一個
字串(目前為空字串)。最後一個是可 true 或 false 的布林變數。有了這些基本資料
型別,就可以做到的大部份 工作。此外,還有兩個進階的資料型別:陣列(array)
和 函數指標(function pointer)。
敘述是 JavaScript 中所有可執行的文字列;它們構成了一 個 script 的架構。沒有了這
些架構,我們只能做些簡單的 運算和執行內建函數。每一種架構都用到了一或多個
保留字 。以下是一個完整的保留字表,紀錄了目前已經實作完成的 敘述: break
comment continue for for...in function if...else return var while with 事實上,還有另一系列
還沒實作出來的保留字。在目前版本 的 JavaScript 中,它們是被解譯器所承認的,但
卻不能在 程式中使用。 abstract boolean byte case catch char class const default do double
extends false final finally float goto implements import instanceof int interface long native
null package private protected public short static super switch synchronized throw throws
transient try void 這些主要是 Java 中的保留字,但目前卻還未為 JavaScript 所支援的。
最容易了解的是 if..then...else 這個架構。基本上,如 果條件為 true 的話,程式就會執
行某個動作;反之則執行 其他動作。例如: if (variable > 20) { ... ... } else { ... } 每個動
作都放在不同的區塊裡。你也可以把這些敘述放進一 系列 if...else 架構中的另一個
else 之後(譯註:巢狀的 if...else)。可惜的是目前尚無 switch 敘述,可以將一 個值和
一組其他的值比較,並對每個不同的值執行不同的敘 述。
while 迴圈提供了一個方法,只要某一個條件是 true 的話, 它就會不斷執行一連串的
命令。當然如果條件永遠不會成為 false 的話,整個程式也有可能卡在 while 迴圈內。
所以要 確定有一條路可以離開這個迴圈。 count = 0; while (count < 10) { write("Hello.
\n"); count++; } for 還有一個更巧妙的方法可以做到如上列 while 迴圈範例中的 功能,
就是用 for 迴圈。它是另一種增加易讀性的速性方式 ,實際上它和上例中的功能是相
同的。 for (count = 0; count < 10; count++) { write("Hello.\n"); } 在括號內有三個部份:初
始化部份 count=0;比較部份 count < 10;和修改部份 count++。初始化部份只在迴圈
本 體開始前被執行一次。接下來比較部份會去檢查迴圈的狀態 ,然後去執行迴圈本
體。當本體執行過一遍後,修改部份才 會被執行到。如你所見,每一個部份都是由
分號所隔開。
只要變數存在某個資料集合中,for..in 結構就會執行某一 個程式區塊。例如, for
count in myArray { write(myArray[count]); } 上例將印出陣列中每一個元素的內容。
關鍵字 function 表示開始定義一個副程式(subroutine), 以便在程式的其他地方使
用。函數的宣告如下: function myfunction(parameter1, parameter2) { // body of the
function } 關鍵字緊接著函數名稱,其命名規則同變數名稱。名稱後面 在括號內列出
所有的參數。上例的函數只有兩個參數,但可 依實際需要增加。不像 C 及其他語
言,其寬鬆的型別檢查 並不要求使用者指定參數的資料型別。當函數被呼叫時才會
去解釋它的型別。舉例來說,我們定義某個函數可以找出兩 個數字的平均值。此函
數在程式中可以這樣呼叫: xxx = 23; yyy = 14; averaged_value = Average(xxx, yyy); 在
內部處理完成後,此函數可以用關鍵字 return 接著一個 數值將結果傳回來。Average
可能是這樣寫的: function Average(value1, value2) { average = (value1 + value2) / 2;
return average; }
break 和 continue 這兩個關鍵字是用在迴圈中,以強制跳 出迴圈,或是忽略某一個程
式區塊中其餘的程式碼,並繼續 迴圈的下一個週期。例如: count = 0; while (count <
10) { if (count == 5) break; write(count + "..."); count++; } 雖然迴圈的條件式指出迴圈應該
一直執行到 count 變成 10 為止,但這個例子只會印出 0 到 5 。這個有 break 敘述 的
if..then 結構會強制迴圈在 5 的時候就終止了。我們 來看看另一個範例: for iteration
in myArray { if (Math.odd(iteration)) continue; writeln(myArray[iteration]); } 此範例用 Math
這個函數來檢查迴圈過程的奇數,並只列 印出陣列中偶數註標的內容。
JavaScript 提供一套迷你的物件以供程式裡使用。在 C 和 BASIC 裡,這些通常稱為函
式庫,可以用來計算三角函數, 在螢幕上列印等。物件是物件導向程式系統
(OOPS)裡的基 本單位。每個物件通常都會有一些特性,也就是變數,以及 一套相
關的函數或是方法(method)。請注意,我們會把函 數和方法這兩個名詞交替使
用;雖然正統的 OOPS 程式員只 稱它為方法,但為了使一些曾經用過 C 和 BASIC 這
類非物 件導向語言的使用者更熟悉,我們繼續交替使用此二術語。 anchor HTML 的
anchor 標籤(tag)物件。 applet Java 方塊物件;目前尚未支援。 button HTML “按鍵
“ 型態的 INPUT 標籤。 checkbox HTML “checkbox“ 型態的 INPUT 標籤。 Date 包
含各種可以列印、計算,以及交換日期等方法的物件。 document 描述 HTML 頁的物
件。 form 控制整個 HTML 表格的物件。 history 目前瀏覽器的 history 列表。 link
HTML 連結(link)的物件。 location 描述 URL 的物件。 Math 包含數學常數、三角函
數以及其他基本非算數運算(non- arithmetic)方法的物件。 password HTML “密碼
“型態的 INPUT 標籤。 radioButton HTML “radio“型態的 INPUT 標籤。 reset HTML
“重置“型態的 INPUT 標籤。 selection 在 HTML 的 TEXTAREA 或“text“型態的
INPUT 標籤中之文字選擇。 string 字串資料型態,包括各種列印及處理字串的方法。
submit HTML “submit“ 型態的 INPUT 標籤。 text HTML “text“ 型態的 INPUT 標
籤。 textArea HTML 之 TEXTAREA 標籤 (注意: selection 物件和 textArea 物件本身是分
開的) window 描述目前瀏覽器或文件視窗的物件。
上列 JavaScript 的物件列表詳盡地列出 Netscape Navigator 目前所支援的物件。你已經
看過了兩個最常 用的方法: write 和 writeln 的用法,它們會自動地 被轉換成
document 物件的一部份。你也看到了 Math 物件的用法。本列表中大部份的物件都是
HTML 表格中 的基本物件。其他還有一些有用但比較不容易解的物件 屬於控制文件
動作的視窗及文件物件。你會發現到並 不存在開檔或是網路連線的物件。因為到目
前為止,這 還是有安全上的顧慮,但在未來還有希望,因為廠商已 經在吵著希望加
進這些功能以創造更強大的 script 語 言了。
大部份 JavaScript 的功能都是經由事件處理者的協 助,從表格或文件內被啟動的。每
個表格型態都有一套 事件以回應如選擇 checkbox、失去焦點,或是文字 欄的“焦點
模糊“(blurring the focus)。下列是完 整的事件列表以及它們所對應到的事件:
onBlur 當 text, selection, 或 textarea 欄失去焦點時觸發。 onChange 當 selection, text,
textarea field 被修改或失去焦點 時觸發。 onClick 當 button, checkbox, link, or radio 物件
被點選時觸發。 onFocus 當 selection, text, or textarea 欄得到焦點時觸發。 onLoad 當視
窗或 FRAME 一載入時觸發。 onMouseOver 當滑鼠移到某個超連結(hyperlink)上時
觸發。 onSelect 當 text or textarea 欄中的文字被選擇時觸發。 onSubmit 當表格內容被
送出去(submit)時觸發。 onUnload 當視窗或是 FRAMESET 關閉,或新的網頁顯示
時被觸發。 事件處理者是被當成一個新的參數加入給定的標籤, 舉例來說:
<INPUT TYPE="button" VALUE="Total Amount" ONCLICK="doTotalAmount(this)"> 本範
例會試著執行如文字所示的的計算。它使用新的 按鍵型態之輸入欄,而且只用在客
戶端的 script 執 行(client-side scripting)。 <A HREF="second_page.html"
ONMOUSEOVER="window.status='Go on to Page 2'; return true;">Next Page</A> 第二個範
例展示了一個便利的方法,讓你可以在瀏覽 器的狀態列上顯示這個連結將指到哪兒
去。
本例中,我們從表格內的輸入欄得到兩個值,並從中 計算出新的值: <HTML>
<HEAD> <TITLE>Calculate this, buddy!</TITLE> <SCRIPT LANGUAGE="JavaScript"> <!--
var myAge; var dadsAge; function HowOld(form) { var difference; difference = dadsAge -
myAge; form.Fdiff.value = difference; } function SetMyAge(age) { myAge = age.value; }
function SetDadsAge(age) { dadsAge = age.value; } // --> </SCRIPT> <BODY> <FORM
METHOD="POST"> <TABLE CELLSPACING=15> <TR> <TD>Enter your Age:</TD> <TD>
<INPUT TYPE=text NAME=Fmyage SIZE=4 ONCHANGE="SetMyAge(this)"></TD> </TR>
<TR> <TD>Enter your Dads Age:</TD> <TD> <INPUT TYPE=text NAME=Fdadsage SIZE=4
ONCHANGE="SetDadsAge(this)"></TD> </TR> <TR> <TD COLSPAN=2><INPUT
TYPE=BUTTON ONCLICK="HowOld(this.form)" VALUE="How much older is Dad?">
</TD> </TR> <TR> <TD COLSPAN=2>You are <INPUT TYPE=text NAME="Fdiff"
VALUE="" SIZE=3> years younger than your dad. <P></TD> </TR> </TABLE> </FORM>
</BODY> </HTML> 此 HTML 檔包含了一個表格,其中有三個輸入欄(事 實上其中一
個是輸出欄)以及一個按鍵可以執行計算 。為了不牽涉到複雜試算表的繁複細節,
此檔只展示 了兩個數字加法最基本的程式碼,就像你從前在幼稚 園所學的。它透過
一些“安全“的方法,如 SetMyAge() 和 SetDadsAge() 這類存取函數,去存取文件內
的變 數。基本上,你將處理的都是比一個單純整數更複雜 的物件。你可以創造出一
個擁有數個特性的物件,每 一個特性都要設定,而且都是用類似的存取函數去設 定
的。還要注意的是此檔設定了文件中某個物件的值; 此例中,名為“Fdiff“的
INPUT 標籤被設成計算完 成後的值。有些東西我們尚未加入,包括確定所輸入 的值
的確的您及令尊的年齡這樣的錯誤檢查方法。