1、第四章.Web應(yīng)用客戶(hù)端開(kāi)發(fā)技術(shù)對(duì)外經(jīng)濟(jì)貿(mào)易大學(xué)信息學(xué)院第四章內(nèi)容第一節(jié).C/S結(jié)構(gòu)向B/S結(jié)構(gòu)演化 第二節(jié).基于HTML的客戶(hù)端開(kāi)發(fā)技術(shù)第三節(jié).基于JavaScript的客戶(hù)端開(kāi)發(fā)技術(shù)第四節(jié).其它客戶(hù)端開(kāi)發(fā)技術(shù)第四章內(nèi)容C/S結(jié)構(gòu)向B/S結(jié)構(gòu)演化 基于HTML的客戶(hù)端開(kāi)發(fā)技術(shù) 基于JavaScript的客戶(hù)端開(kāi)發(fā)技術(shù) 其它客戶(hù)端開(kāi)發(fā)技術(shù) 第一節(jié) C/S結(jié)構(gòu)向B/S結(jié)構(gòu)演化 隨著網(wǎng)絡(luò)技術(shù)的發(fā)展，應(yīng)用軟件的結(jié)構(gòu)也在不斷發(fā)展，目前，典型的應(yīng)用結(jié)構(gòu)有C/S（Client/Server,客戶(hù)/服務(wù)器）結(jié)構(gòu)、B/S(Browser/Server，瀏覽器/服務(wù)器)結(jié)構(gòu)。其中B/S結(jié)構(gòu)作為Web應(yīng)用的一種主

2、流技術(shù)得到廣泛使用，單獨(dú)的C/S應(yīng)用相對(duì)來(lái)說(shuō)越來(lái)越少，而是更多地和B/S結(jié)合起來(lái)使用，以便滿足大多數(shù)復(fù)雜應(yīng)用的要求。 1. C/S結(jié)構(gòu) C/S結(jié)構(gòu)指的是客戶(hù)/服務(wù)器結(jié)構(gòu)。這種結(jié)構(gòu)的應(yīng)用程序在結(jié)構(gòu)上一般分為兩部分，一部分稱(chēng)為客戶(hù)端程序，通常安裝在單獨(dú)的一臺(tái)機(jī)器上，這臺(tái)機(jī)器被稱(chēng)為客戶(hù)機(jī)，用戶(hù)通過(guò)它來(lái)使用應(yīng)用軟件；另一部分稱(chēng)為服務(wù)器端程序，一般部署在另一臺(tái)獨(dú)立的機(jī)器上，這臺(tái)機(jī)器被稱(chēng)為服務(wù)器?？蛻?hù)端和服務(wù)器通過(guò)網(wǎng)絡(luò)通訊，多臺(tái)客戶(hù)端可以同時(shí)訪問(wèn)一臺(tái)服務(wù)器。 C/S結(jié)構(gòu)的理念是胖客戶(hù)端（客戶(hù)端功能較強(qiáng)），它同時(shí)利用了客戶(hù)端機(jī)器和服務(wù)器的硬件計(jì)算能力，所有的業(yè)務(wù)邏輯都是基于客戶(hù)端的實(shí)現(xiàn)，客戶(hù)端接受用戶(hù)的請(qǐng)求

3、，并向數(shù)據(jù)庫(kù)服務(wù)提出請(qǐng)求，后端的數(shù)據(jù)服務(wù)器完成數(shù)據(jù)的集中存儲(chǔ)和管理。它響應(yīng)客戶(hù)的請(qǐng)求將數(shù)據(jù)提交給客戶(hù)端，客戶(hù)端再對(duì)數(shù)據(jù)進(jìn)行集中處理和計(jì)算，然后將結(jié)果顯示給用戶(hù)。在這種結(jié)構(gòu)中，客戶(hù)端機(jī)器要求有一定的計(jì)算能力，服務(wù)器的硬件也必須具有足夠的處理能力。兩層結(jié)構(gòu)的應(yīng)用程序（參見(jiàn)圖4-1）就是早期的C/S結(jié)構(gòu)應(yīng)用程序模型，它主要由完成業(yè)務(wù)邏輯的客戶(hù)機(jī)和存儲(chǔ)業(yè)務(wù)數(shù)據(jù)的數(shù)據(jù)庫(kù)服務(wù)器組成。 CS結(jié)構(gòu)在技術(shù)上應(yīng)用已經(jīng)很成熟，如下是它的一些主要優(yōu)點(diǎn)：交互性強(qiáng)：供用戶(hù)使用的客戶(hù)端交互界面功能較強(qiáng)，客戶(hù)程序和服務(wù)器程序的交互方便。網(wǎng)絡(luò)通信量低：客戶(hù)端和服務(wù)器端只傳輸有效數(shù)據(jù), 利于處理大量數(shù)據(jù).響應(yīng)速度較快:這種應(yīng)用一

4、般在局域網(wǎng)內(nèi)使用，加上網(wǎng)絡(luò)通信量低，所以服務(wù)器對(duì)客戶(hù)端的響應(yīng)較快。 盡管基于CS結(jié)構(gòu)可以開(kāi)發(fā)出功能強(qiáng)的應(yīng)用程序，但是C/S結(jié)構(gòu)的應(yīng)用程序也具有以下缺點(diǎn)：軟件維護(hù)和功能升級(jí)較困難 由于應(yīng)用邏輯和用戶(hù)界面等代碼混雜在一起，代碼的維護(hù)和功能升級(jí)比較困難，修改一些小的地方可能都會(huì)影響很大，增加新的功能也需要仔細(xì)考慮和原有的代碼在結(jié)構(gòu)上如何共存。部署及維護(hù)困難，不利于擴(kuò)展 CS結(jié)構(gòu)的應(yīng)用程序，要求在每個(gè)客戶(hù)端都安裝客戶(hù)端應(yīng)用程序，不能實(shí)現(xiàn)快速部署安裝和配置，同時(shí)難于維護(hù)，難于適應(yīng)集中管理的要求，要求具有一定專(zhuān)業(yè)水準(zhǔn)的技術(shù)人員去完成安裝和維護(hù)。通常這種結(jié)構(gòu)多用于小型局域網(wǎng)，不利于擴(kuò)展。數(shù)據(jù)安全性不好 因?yàn)?/p>

5、客戶(hù)端程序可直接訪問(wèn)服務(wù)器上的數(shù)據(jù)庫(kù)（很多應(yīng)用都是這樣），那么，在客戶(hù)端計(jì)算機(jī)上的其他應(yīng)用程序也可以非法訪問(wèn)數(shù)據(jù)庫(kù)，這樣數(shù)據(jù)庫(kù)的安全性受到威脅。 2.多層C/S結(jié)構(gòu) 軟件多層結(jié)構(gòu)一般將用戶(hù)界面功能、業(yè)務(wù)邏輯功能和數(shù)據(jù)庫(kù)的數(shù)據(jù)處理等功能分散在不同軟件層次上，每個(gè)層次上關(guān)注的功能不同，典型的如三層C/S結(jié)構(gòu)將應(yīng)用分成三層：用戶(hù)界面層、應(yīng)用邏輯層和數(shù)據(jù)庫(kù)層（參見(jiàn)圖4-2）。用戶(hù)界面層主要完成用戶(hù)的交互式界面，用于系統(tǒng)輸入和輸出；應(yīng)用邏輯層一般部署在應(yīng)用服務(wù)器上，完成應(yīng)用邏輯和控制等功能，系統(tǒng)的復(fù)雜性也主要體現(xiàn)在這一層；最后的數(shù)據(jù)庫(kù)服務(wù)器存儲(chǔ)大量的數(shù)據(jù)信息和數(shù)據(jù)邏輯，所有與數(shù)據(jù)有關(guān)的安全、完整性控制、

6、數(shù)據(jù)的一致性、并發(fā)操作等都由它完成。 多層結(jié)構(gòu)設(shè)計(jì)給軟件開(kāi)發(fā)帶來(lái)以下好處：可重用性 因?yàn)橛辛藰I(yè)務(wù)層的獨(dú)立存在，業(yè)務(wù)層中的各種業(yè)務(wù)單元可以被不同的應(yīng)用程序使用,可復(fù)用性強(qiáng)。配置的靈活性 軟件系統(tǒng)被分成了獨(dú)立的多層，可以根據(jù)企業(yè)對(duì)于業(yè)務(wù)的功能需求和性能需求靈活地配置各層次的物理位置，各層的硬件要求也可以根據(jù)應(yīng)用規(guī)模的變化獨(dú)立調(diào)整。開(kāi)發(fā)并行性 只要事先設(shè)計(jì)好各層之間的接口，各層就可以在約定好的接口下進(jìn)行并行開(kāi)發(fā)。系統(tǒng)升級(jí)容易，軟件維護(hù)難度小 當(dāng)軟件需求變更時(shí)或技術(shù)進(jìn)步時(shí)，只需要更改相應(yīng)層中的組件，在保證接口不變的情況下，不會(huì)影響系統(tǒng)的其他部分。 當(dāng)業(yè)務(wù)規(guī)則變化時(shí)，只要更新單一的業(yè)務(wù)層，對(duì)其他層影響不

7、大，軟件維護(hù)成本較低。 3. B/S結(jié)構(gòu) B/S（Browser/Server）結(jié)構(gòu)代表瀏覽器和服務(wù)器結(jié)構(gòu)。它是隨著Internet技術(shù)的興起，對(duì)C/S結(jié)構(gòu)的一種改進(jìn)的結(jié)構(gòu)。在B/S結(jié)構(gòu)下，用戶(hù)工作界面是通過(guò)Web瀏覽器來(lái)實(shí)現(xiàn)，一般Web瀏覽器和HTML文檔以及一些腳本等共同完成用戶(hù)界面功能，主要的業(yè)務(wù)邏輯在Web 服務(wù)器端實(shí)現(xiàn)(Web服務(wù)器也可能擴(kuò)充，比如一些支持Java技術(shù)的容器)。用戶(hù)通過(guò)瀏覽器向分布在網(wǎng)絡(luò)上的Web服務(wù)器發(fā)出請(qǐng)求，Web服務(wù)器處理請(qǐng)求，可能會(huì)執(zhí)行其它的應(yīng)用程序，或者訪問(wèn)數(shù)據(jù)庫(kù)并完成數(shù)據(jù)處理、最后將結(jié)果返回給Web瀏覽器。 B/S結(jié)構(gòu)的應(yīng)用一般采用3層結(jié)構(gòu)，分別是用戶(hù)界面

8、層，應(yīng)用層和數(shù)據(jù)庫(kù)層(參見(jiàn)圖4-3三層)。用戶(hù)界面層在瀏覽器中執(zhí)行。B/S三層結(jié)構(gòu)和三層C/S體系結(jié)構(gòu)的一個(gè)很大不同點(diǎn)是用戶(hù)界面層的區(qū)別，在B/S結(jié)構(gòu)中，用戶(hù)界面層一般在Web服務(wù)器上部署，而三層C/S結(jié)構(gòu)它一般在客戶(hù)機(jī)本地。另外，B/S三層結(jié)構(gòu)采用了Web服務(wù)器。 B/S結(jié)構(gòu)主要優(yōu)點(diǎn)如下： 分布性強(qiáng)、維護(hù)方便：所有的應(yīng)用程序都在Web服務(wù)器上安裝，且只有一份。大大簡(jiǎn)化了客戶(hù)端，只要裝上操作系統(tǒng)、網(wǎng)絡(luò)協(xié)議軟件以及瀏覽器即可。已經(jīng)形成了標(biāo)準(zhǔn)的開(kāi)發(fā)技術(shù)（JAVA技術(shù)，.Net技術(shù)），廣泛的應(yīng)用服務(wù)器支持，相對(duì)B/S應(yīng)用來(lái)說(shuō)，開(kāi)發(fā)應(yīng)用的難度已經(jīng)降低。B/S結(jié)構(gòu)提供了異種機(jī)、異種網(wǎng)、異種應(yīng)用服務(wù)的聯(lián)機(jī)

9、、聯(lián)網(wǎng)、統(tǒng)一服務(wù)的開(kāi)放性技術(shù)基礎(chǔ)。 B/S結(jié)構(gòu)也有如下缺點(diǎn)： 數(shù)據(jù)安全性需要單獨(dú)解決數(shù)據(jù)傳輸速度慢軟件的個(gè)性化特點(diǎn)明顯降低某些功能較難實(shí)現(xiàn)：例如大量的數(shù)據(jù)輸入、報(bào)表制作等。 4. C/S和B/S結(jié)合使用 B/S技術(shù)盡管得到廣泛認(rèn)同，成為軟件開(kāi)發(fā)技術(shù)的主流，但是傳統(tǒng)的C/S體系結(jié)構(gòu)并非一無(wú)是處，很多時(shí)候，C/S和B/S可以結(jié)合使用，這樣充分發(fā)揮二者的優(yōu)勢(shì)，彌補(bǔ)彼此的不足。 一般信息發(fā)布多采用B/S結(jié)構(gòu)，保持了B/S結(jié)構(gòu)瘦客戶(hù)端的優(yōu)點(diǎn)?？蛻?hù)機(jī)只需要具有WWW瀏覽器就可以訪問(wèn)應(yīng)用。 數(shù)據(jù)庫(kù)訪問(wèn)多采用C/S結(jié)構(gòu)。實(shí)際上，前面提到的三層BS結(jié)構(gòu)中，Web服務(wù)器中的應(yīng)用邏輯本身就是使用了C/S技術(shù)和數(shù)據(jù)庫(kù)

10、交互。在Web服務(wù)器上并不存在完全采用C/S結(jié)構(gòu)帶來(lái)的客戶(hù)端維護(hù)工作量大等缺點(diǎn)。在這里（Web服務(wù)器中應(yīng)用邏輯）采用C/S結(jié)構(gòu)可以構(gòu)造非常復(fù)雜的應(yīng)用。 另外，如果瀏覽器（A方）的一個(gè)業(yè)務(wù)請(qǐng)求到達(dá)Web服務(wù)器，在Web服務(wù)器端的程序（B方）還需要和其他應(yīng)用（C方）交互，以獲取需要的信息而完成這個(gè)業(yè)務(wù)請(qǐng)求，這時(shí)，由于Web服務(wù)器端的程序（B）是沒(méi)有界面的程序，它一般不會(huì)采用B/S結(jié)構(gòu)去和其他應(yīng)用（C）通信，它往往采用C/S結(jié)構(gòu)把自己（B）作為一個(gè)客戶(hù)端，向其他應(yīng)用(C)方發(fā)起請(qǐng)求以獲取數(shù)據(jù)，然后把獲取的數(shù)據(jù)返回給瀏覽器（A）。 B/S和C/S這兩種軟件體系結(jié)構(gòu)的有機(jī)結(jié)合，可以揚(yáng)長(zhǎng)避短，有效地發(fā)揮了

11、各自的優(yōu)勢(shì)。在應(yīng)用開(kāi)發(fā)時(shí)候要靈活運(yùn)用它們。 第四章內(nèi)容第一節(jié).C/S結(jié)構(gòu)向B/S結(jié)構(gòu)演化 第二節(jié).基于HTML的客戶(hù)端開(kāi)發(fā)技術(shù)第三節(jié).基于JavaScript的客戶(hù)端開(kāi)發(fā)技術(shù)第四節(jié).其它客戶(hù)端開(kāi)發(fā)技術(shù)第二節(jié) 基于HTML的客戶(hù)端開(kāi)發(fā)技術(shù) 1. HTML的特點(diǎn) HTML及其技術(shù)具有跨平臺(tái)性、易用性、以及瘦客戶(hù)端等特性。 1) 跨平臺(tái)性 采用HTML制作的網(wǎng)頁(yè)一般需要發(fā)布到WWW服務(wù)器供用戶(hù)訪問(wèn)，無(wú)論是UNIX操作系統(tǒng)、Windows操作系統(tǒng)還是Linux操作系統(tǒng)，都有很多WWW服務(wù)器軟件可以在它們之上運(yùn)行。開(kāi)發(fā)的HTML網(wǎng)頁(yè)可以發(fā)布在任何WWW服務(wù)器上，而不受操作系統(tǒng)和WWW服務(wù)器的限制；另外，

12、HTML的語(yǔ)法是由W3C(World Wide Web Consortium)定義和維護(hù)的，客戶(hù)端的瀏覽器如IE（Internet Explorer，微軟瀏覽器軟件）、Navagator（Netscape瀏覽器軟件）和其他的一些瀏覽器軟件都支持，這樣也不受用戶(hù)瀏覽器差異的限制。 2) 易用性 易于使用，無(wú)論是編寫(xiě)HTML頁(yè)面還是訪問(wèn)頁(yè)面都比較簡(jiǎn)單。很多用戶(hù)和開(kāi)發(fā)人員都樂(lè)于放棄具有復(fù)雜的用戶(hù)界面的C/S結(jié)構(gòu)的應(yīng)用，而愿意使用基于HTML的擁有簡(jiǎn)單界面的應(yīng)用。 3)瘦客戶(hù)應(yīng)用 采用HTML及其擴(kuò)展技術(shù)（如Servlet，JSP，CGI，ASP等）開(kāi)發(fā)的應(yīng)用，屬于典型的瘦客戶(hù)應(yīng)用，甚至零客戶(hù)端應(yīng)用。

13、用戶(hù)的機(jī)器上除了要求安裝有瀏覽器（微軟操作系統(tǒng)自帶瀏覽器）外，不需再安裝其他軟件。基于HTML的應(yīng)用程序部署成本低而且應(yīng)用的結(jié)構(gòu)簡(jiǎn)單。 2. HTML標(biāo)記在開(kāi)發(fā)中的應(yīng)用 1) 靜態(tài)信息發(fā)布 信息共享、信息發(fā)布是WWW及HTML技術(shù)發(fā)明的最初目的，信息發(fā)布目前仍然是HTML最廣泛的應(yīng)用。通過(guò)編寫(xiě)包含各種信息的簡(jiǎn)單的HTML腳本，然后將腳本放到WWW服務(wù)器上(發(fā)布)，客戶(hù)就可以通過(guò)一個(gè)被公布的URL訪問(wèn)這些信息。很多信息可能就是一次簡(jiǎn)單的發(fā)布，特別是很多企業(yè)或者個(gè)人的信息本身比較少，對(duì)信息發(fā)布沒(méi)有高的要求，對(duì)歷史信息也不需要維護(hù)，這種需求單獨(dú)使用HTML就可以滿足需求。如果通過(guò)一些網(wǎng)頁(yè)開(kāi)發(fā)工具（如

14、FrontPage，Dreamweaver）可以更加方便的進(jìn)行信息格式化。更為簡(jiǎn)單的是，Word字處理軟件是使用最廣泛的編輯軟件，使用它可以直接將編輯的內(nèi)容保存為HTML格式的網(wǎng)頁(yè)，然后方便地發(fā)布。 2) HTML與服務(wù)器端程序交互 對(duì)于有些信息發(fā)布應(yīng)用，出于各種需要，可能需要服務(wù)器端的程序進(jìn)行一些管理和邏輯處理。HTML主要是通過(guò)Form標(biāo)記和鏈接去和后端服務(wù)器應(yīng)用進(jìn)行交互的。 HTML中的Form標(biāo)記 在各種HTML標(biāo)記里面，F(xiàn)orm標(biāo)記（也叫表單標(biāo)記）是最重要的元素之一。Form標(biāo)記主要用于接收用戶(hù)的輸入，同時(shí)將接收的輸入信息提交給后臺(tái)的處理程序，處理程序可能是CGI程序、JSP或者AS

15、P等任意的服務(wù)器端程序。在基于瀏覽器的Web應(yīng)用程序中，F(xiàn)orm標(biāo)記是最主要的輸入手段，而輸入（和輸出）是應(yīng)用程序的重要功能，因此，設(shè)計(jì)和開(kāi)發(fā)Form是開(kāi)發(fā)Web應(yīng)用的主要工作之一。 HTML中的鏈接元素 HTML中的鏈接主要是用于組織頁(yè)面，鏈接除了可以鏈接一些靜態(tài)的網(wǎng)頁(yè)和圖片外，它也可以鏈接到后臺(tái)的Servlet，JSP，CGI，ASP等一類(lèi)的處理程序，所以，鏈接也是和后臺(tái)交互的重要手段之一。通過(guò)鏈接和后臺(tái)的交互與通過(guò)Form和后臺(tái)交互有以下不同： 鏈接只能使用Get方式；而Form通過(guò)method屬性可以使用Get，也可以使用Post。 鏈接提交的信息是固定的，鏈接里面可能會(huì)包含一些參數(shù)（

16、“名字/值”對(duì)，如一個(gè)鏈接的URL為http:/web?query=圖書(shū)），但是這些“名字/值”對(duì)（如：query=小說(shuō)）是事先寫(xiě)好的，用戶(hù)點(diǎn)擊鏈接后會(huì)按照這些內(nèi)容（query=小說(shuō)）提交給服務(wù)器后端，用戶(hù)不能動(dòng)態(tài)輸入這些信息（除非在地址欄輸入后提交）。而Form可以通過(guò)Form子標(biāo)記進(jìn)行輸入，輸入的信息會(huì)提交給后端。 3. HTML和服務(wù)器端程序的配合 HTML本身是靜態(tài)的，用于發(fā)布共享的信息。實(shí)際應(yīng)用中，Web應(yīng)用需要提供動(dòng)態(tài)的信息，這時(shí)需要服務(wù)器端的程序進(jìn)行一些管理和邏輯處理。比如，應(yīng)用需要提供以下支持：應(yīng)用要根據(jù)用戶(hù)的輸入給出響應(yīng)。應(yīng)用的信息來(lái)自數(shù)據(jù)庫(kù)，而數(shù)據(jù)庫(kù)里的數(shù)據(jù)會(huì)定期或者不定期

17、變化，每次發(fā)布時(shí)候都要將數(shù)據(jù)庫(kù)最新的數(shù)據(jù)發(fā)布。應(yīng)用的有些信息是有權(quán)限控制的，不同權(quán)限的人看到的信息不同，等等。 這些需求非常普遍，通過(guò)和Servlet，JSP，CGI，ASP等服務(wù)器端技術(shù)的結(jié)合可以實(shí)現(xiàn)這些動(dòng)態(tài)的效果。無(wú)論是Servlet，JSP，CGI還是ASP，通過(guò)鏈接或者Form都可以由客戶(hù)端的HTML調(diào)用，在這些服務(wù)器端執(zhí)行的程序（或者腳本）都可以通過(guò)調(diào)用各自的提供的編程接口獲取前端提交來(lái)的數(shù)據(jù)，然后對(duì)數(shù)據(jù)進(jìn)行處理，最后給出處理的響應(yīng)。針對(duì)瀏覽器提交的請(qǐng)求，響應(yīng)一般是另一個(gè)新的HTML頁(yè)面，新的HTML頁(yè)面可以包含任何HTML標(biāo)記，并可以繼續(xù)和后端的應(yīng)用進(jìn)行交互。 4. HTML技術(shù)的

18、局限性 盡管HTML技術(shù)有它與生俱來(lái)的優(yōu)點(diǎn)，但是某些應(yīng)用系統(tǒng)并不完全適合采用HTML技術(shù)，如：一些較復(fù)雜的應(yīng)用軟件可能要求多次提取網(wǎng)頁(yè)來(lái)完成一項(xiàng)事務(wù)處理，這往往導(dǎo)致交互速度無(wú)法接受。一些應(yīng)用要求有復(fù)雜的用戶(hù)界面。一些應(yīng)用要完成復(fù)雜的計(jì)算，這也不是HTML的特長(zhǎng)。使用HTML，一些簡(jiǎn)單的交互活動(dòng)也可能需要用很多的腳本來(lái)完成。通過(guò)Form等和后臺(tái)交互，HTML網(wǎng)頁(yè)只能通過(guò)簡(jiǎn)單的“名字/值”對(duì)和服務(wù)器端的應(yīng)用傳輸數(shù)據(jù)，數(shù)據(jù)封裝能力較差。 3.表單標(biāo)記 表單是HTML頁(yè)面和服務(wù)器端程序交互的核心。表單相關(guān)的常用標(biāo)記如下： 通過(guò)這些標(biāo)記，可以實(shí)現(xiàn)包含各種界面元素的用戶(hù)交互界面，用于用戶(hù)輸入信息，提交給后

19、臺(tái)處理。比如前面提到的，對(duì)于Form各種標(biāo)記的學(xué)習(xí)，重點(diǎn)要掌握它們的用途，各種屬性（特別是name屬性，value屬性，type屬性）及屬性的作用。 標(biāo)記對(duì) 作用 標(biāo)記對(duì)的作用是定義表單的開(kāi)始和結(jié)束位置，屬于處理表單的其它標(biāo)記都應(yīng)該放在這對(duì)標(biāo)記之間。由這些標(biāo)記的適當(dāng)組合來(lái)創(chuàng)建一個(gè)表單，用戶(hù)通過(guò)Form及其子標(biāo)記輸入信息并提交給服務(wù)器端程序處理，在Form標(biāo)記中可以指定服務(wù)器端的處理程序。特點(diǎn) 標(biāo)記對(duì)要成對(duì)使用，標(biāo)記具有ACTION、METHOD和TARGET屬性。ACTION屬性 ACTION指定處理程序，其參數(shù)值是該處理程序的程序名及其網(wǎng)絡(luò)路徑（網(wǎng)址或相對(duì)路徑)，如：，當(dāng)用戶(hù)提交表單時(shí)，服務(wù)

20、器將執(zhí)行網(wǎng)址http:/上的名為counter.jsp的JSP代碼。METHOD屬性 METHOD屬性用來(lái)定義處理程序從表單中獲得信息的方式，可取值為 GET 和 POST 的其中一個(gè)。 GET方式是處理程序從當(dāng)前HTML文檔中獲取數(shù)據(jù)，然而這種方式傳送的數(shù)據(jù)量是有所限制的，一般限制在1KB以下。POST方式與GET方式相反，它是當(dāng)前的HTML文檔把數(shù)據(jù)傳送給處理程序，傳送的數(shù)據(jù)量要比使用GET方式的大的多。 TARGET屬性用來(lái)指定目標(biāo)窗口或目標(biāo)框架（Html的Frame）。當(dāng)提交一個(gè)請(qǐng)求給服務(wù)器后，一般服務(wù)器要給客戶(hù)端一個(gè)響應(yīng)，這個(gè)響應(yīng)可能是一個(gè)新的頁(yè)面，新的頁(yè)面可以在提交窗口顯示，并且可

21、以指定顯示的框架；響應(yīng)也可以在一個(gè)新的窗口顯示，通過(guò)TARGET屬性可以實(shí)現(xiàn)這些功能。 2) 標(biāo)記 作用 好的軟件總是會(huì)為用戶(hù)提供方便的操作界面，比如文本框、復(fù)選框等。HTML的標(biāo)記就可以提供這樣的功能，它用來(lái)定義一個(gè)用戶(hù)輸入?yún)^(qū)。用戶(hù)可以使用INPUT標(biāo)記中的text，checkbox，hidden，pass word，radio進(jìn)行輸入，然后提交給服務(wù)器端程序處理。類(lèi)型為submit的元素用于將輸入的表單內(nèi)容提交給服務(wù)器；類(lèi)型為reset的元素將表單內(nèi)容全部清除，以便重新填寫(xiě)。特點(diǎn) 標(biāo)記不是成對(duì)使用的。它必須放在標(biāo)記對(duì)之間。標(biāo)記的TYPE屬性的語(yǔ)法為： 其引號(hào)內(nèi)應(yīng)該輸入?yún)?shù)值，可以在8個(gè)參數(shù)

22、值中選擇一個(gè)，TYPE屬性的不同的值分別提供了八種類(lèi)型的輸入?yún)^(qū)域，其各自的參數(shù)值、輸入?yún)^(qū)域的類(lèi)型和形狀請(qǐng)看下邊 表TYPE屬性的參數(shù)值、輸入?yún)^(qū)域的類(lèi)型和形狀 3）標(biāo)記對(duì) 作用 標(biāo)記對(duì)用來(lái)創(chuàng)建一個(gè)下拉列表框或可以復(fù)選的列表框。用戶(hù)可以在SELECT中選擇1個(gè)或者多個(gè)輸入項(xiàng)目，提交給服務(wù)器端程序處理。特點(diǎn) 標(biāo)記對(duì)總是成對(duì)使用，放在標(biāo)記對(duì)之間。標(biāo)記具有MULTIPLE、NAME和SIZE屬性。的屬性 在的屬性中，MULTIPLE屬性不用賦值，直接加入標(biāo)記中即可使用，加入了此屬性后列表框就成了可多選的了。 NAME屬性的值是此列表框的名字。 SIZE屬性用來(lái)設(shè)置列表的高度，缺省時(shí)值為1，若沒(méi)有設(shè)置這個(gè)

23、屬性，顯示的將是一個(gè)彈出式的列表框。 4）標(biāo)記 作用 對(duì)于標(biāo)記對(duì)所創(chuàng)建的列表框，會(huì)有多個(gè)選項(xiàng)，其中每個(gè)選項(xiàng)顯示的具體內(nèi)容，以及這些選項(xiàng)中的默認(rèn)選項(xiàng)都是由標(biāo)記來(lái)規(guī)定的。特點(diǎn) 標(biāo)記不成對(duì)使用，放在標(biāo)記對(duì)之間。它有SELECTED和VALUE兩個(gè)屬性。VALUE屬性指定列表框多個(gè)選項(xiàng)中的一個(gè)選項(xiàng)顯示的具體內(nèi)容。SELECTED屬性指定列表框多個(gè)選項(xiàng)中的一個(gè)選項(xiàng)作為默認(rèn)的選項(xiàng)。標(biāo)記的屬性值要傳送到服務(wù)器上，服務(wù)器通過(guò)調(diào)用區(qū)域的名字的VALUE屬性來(lái)獲得該區(qū)域選中的數(shù)據(jù)項(xiàng)。使用SELECT和OPTION輸入信息并提交給服務(wù)器的時(shí)候，要特別注意，顯示的內(nèi)容和提交的內(nèi)容可能不同，因?yàn)轱@示和提交的內(nèi)容分別在兩

24、個(gè)位置指定，顯示要求直觀，容易理解，而提交的被程序處理的內(nèi)容沒(méi)有這些要求。比如在一個(gè)Form的SELECT標(biāo)記中包含了一個(gè)OPTION標(biāo)記，定義為：AC米蘭，用戶(hù)在界面上看到的“AC米蘭”,而如果Form被提交，那么名字為qd的SELECT提交給服務(wù)器端的值為“ml”，而不是“AC米蘭”。 標(biāo)記示例 5）標(biāo)記對(duì) 用來(lái)創(chuàng)建一個(gè)可以輸入多行文字的文本框，此標(biāo)記對(duì)用于標(biāo)記對(duì)之間。具有NAME、COLS和ROWS屬性。COLS和ROWS屬性分別用來(lái)設(shè)置文本框的列數(shù)和行數(shù)，這里列與行是以字符數(shù)為單位的。如果客戶(hù)端要提交大量的文本信息給服務(wù)器端，使用TEXTAREA是一個(gè)選擇。請(qǐng)看下邊表： 除了上面介紹的

25、標(biāo)記外，還有一些其他的標(biāo)記，使用相對(duì)較少，限于篇幅，這里不再一一介紹，實(shí)際開(kāi)發(fā)中如果使用到，可參考其他資料。另外，F(xiàn)orm相關(guān)元素還有事件這樣的屬性，比如用戶(hù)用鼠標(biāo)單擊以下對(duì)象時(shí)，會(huì)產(chǎn)生onClick事件：button（按鈕對(duì)象） checkbox（復(fù)選按鈕） radio （單選按鈕） reset buttons（重新填寫(xiě)Form按鈕） submit buttons（提交按鈕）其他的事件包括：文本框內(nèi)容改變會(huì)引發(fā)事件onChange 當(dāng)Text或TextArea對(duì)象中的文字被加亮后，引發(fā)onSelect事件當(dāng)用戶(hù)單擊Text或TextArea以及select對(duì)象時(shí)，此時(shí)該對(duì)象成為激活對(duì)象。產(chǎn)生

26、onFocus獲得焦點(diǎn)事件當(dāng)Text對(duì)象、TextArea對(duì)象及select對(duì)象不再擁有焦點(diǎn)，引發(fā)失去焦點(diǎn)onBlur事件 類(lèi)似的事件發(fā)生時(shí)，可以在屬性中指定調(diào)用JavaScript腳本動(dòng)態(tài)處理，在JavaScript中可以操作Form對(duì)象并提交Form內(nèi)容給服務(wù)器，進(jìn)一步的說(shuō)明，請(qǐng)參看JavaScript部分。 4.綜合示例 下面給出一個(gè)售書(shū)網(wǎng)站的前端購(gòu)物流程中的典型的HTML頁(yè)面。包括：新用戶(hù)注冊(cè)，商品搜索，購(gòu)物綜合面。1）新用戶(hù)注冊(cè) 對(duì)許多網(wǎng)站而言，在使用其提供的功能的時(shí)候，都需要先注冊(cè)，新用戶(hù)注冊(cè)是用戶(hù)常用的一個(gè)功能，有很多種形式，以下是一種常見(jiàn)的注冊(cè)方式，其界面見(jiàn)圖，它可以用頁(yè)面開(kāi)發(fā)

27、工具，或者采用手工編碼來(lái)實(shí)現(xiàn)。下面采用HTML來(lái)編寫(xiě)其程序。 下面是其HTML代碼，其網(wǎng)頁(yè)見(jiàn)圖4-4：客戶(hù)信息 會(huì)員名稱(chēng)： * 密碼： * 密碼為一個(gè) 4-8位的數(shù)字或英文字母 重復(fù)輸入密碼： * 真實(shí)姓名： * 性別： 男 女 聯(lián)系電話： * 移動(dòng)電話： E-Mail ： * 所在地區(qū)： 請(qǐng)選擇.北京廣東香港澳門(mén)臺(tái)灣中國(guó)以外地區(qū) * 詳細(xì)地址： * （為方便我們及時(shí)將書(shū)送到您手上，請(qǐng)您提供盡可能詳細(xì)的地址及所在單位名） 郵政編碼： * 工作單位： 客服電話：(010)64491861 ； (010) 64491862 傳真： (010)- 64491863 客戶(hù)服務(wù) E-mail ： ser

28、vice 2)商品搜索 商品搜索也是用戶(hù)常用的一個(gè)功能，有很多種搜索形式，以下以通過(guò)關(guān)鍵字搜索的前端頁(yè)面作為示例。它可以用頁(yè)面開(kāi)發(fā)工具，或者手工編碼實(shí)現(xiàn)。下面是采用HTML編寫(xiě)的程序，其界面見(jiàn)下圖。 商品搜索 類(lèi)別： 所有類(lèi)別 圖書(shū) 影視 音樂(lè) 游戲 軟件 虛擬卡 時(shí)尚 專(zhuān)賣(mài) 關(guān)鍵字： 訂單查詢(xún)界面可以采用類(lèi)似的界面，輸入訂單號(hào)查詢(xún)處理情況。另外，可以輸入會(huì)員號(hào)碼查詢(xún)?cè)摃?huì)員所有的訂單情況。 3）購(gòu)物綜合頁(yè)面 當(dāng)客戶(hù)訪問(wèn)到一個(gè)網(wǎng)站的主頁(yè)面，可以通過(guò)頁(yè)面合理的導(dǎo)航功能，點(diǎn)擊其上的鏈接完成購(gòu)物功能，一般購(gòu)物主頁(yè)面都包含許多購(gòu)物鏈接。我們看一下簡(jiǎn)化后的新浪商城的購(gòu)物主頁(yè)面，復(fù)雜的頁(yè)面實(shí)際是前面介紹的各

29、類(lèi)標(biāo)記的綜合運(yùn)用，特別是TABLE標(biāo)記的應(yīng)用，TABLE大量被用來(lái)做頁(yè)面設(shè)計(jì)，尤其是版面的布局上。盡管這樣的代碼較多，但是大量用到重復(fù)的標(biāo)記，其邏輯并不復(fù)雜。下面是其程序代碼，其界面見(jiàn)下圖 ： 購(gòu)物商城 td,p,input,selectfont-size:12px; 購(gòu)物車(chē) 訂單查詢(xún) 通訊 電腦 數(shù)碼 投影 鮮花 禮品 音像 筆記本 投影 鮮花 禮品 音像 筆記本 商 城 搜 索 所有商品 IT 食品 日用品 熱門(mén)關(guān)鍵字：MP3 超薄經(jīng)典！ 追求完音空間，馬拉松式音樂(lè)享受! 云網(wǎng)D時(shí)代 體驗(yàn)數(shù)字化商品感受無(wú)接觸購(gòu)物 索尼DV全線降價(jià) 索尼數(shù)款攝像機(jī)優(yōu)惠促銷(xiāo)，給您優(yōu)惠的價(jià)格 首信C8188 首

30、信C8188拍照手機(jī)送300元超值大禮 黛安芬 低至3折 名品搶購(gòu)中 MP4影院1980元 CVC新品MP4掌上影院,影片錄制播放,MP3播放 第四章內(nèi)容第一節(jié).C/S結(jié)構(gòu)向B/S結(jié)構(gòu)演化 第二節(jié).基于HTML的客戶(hù)端開(kāi)發(fā)技術(shù)第三節(jié).基于JavaScript的客戶(hù)端開(kāi)發(fā)技術(shù)第四節(jié).其它客戶(hù)端開(kāi)發(fā)技術(shù)第三節(jié) JavaScript的客戶(hù)端開(kāi)發(fā) HTML只能提供一種靜態(tài)的信息資源，缺少動(dòng)態(tài)的效果，將HTML和服務(wù)器端的技術(shù)的結(jié)合以后，在服務(wù)器端可以實(shí)現(xiàn)動(dòng)態(tài)效果。但是，在客戶(hù)端如何實(shí)現(xiàn)動(dòng)態(tài)效果？客觀上存在著這種需求，如：使得Web頁(yè)面是活動(dòng)的，可以處理各種事件，如鼠標(biāo)在圖片上的移動(dòng)會(huì)產(chǎn)生圖片的更換或者

31、翻轉(zhuǎn)效果等客戶(hù)端進(jìn)行一些邏輯判斷和數(shù)據(jù)處理， 動(dòng)態(tài)決定是否提交數(shù)據(jù)給服務(wù)器端程序第三節(jié) JavaScript的客戶(hù)端開(kāi)發(fā)這些要求可以通過(guò)JavaScript得到滿足。JavaScript在客戶(hù)端的開(kāi)發(fā)的應(yīng)用中有著非常重要的作用，可以使得應(yīng)用非常靈活，因篇幅限制，本書(shū)么沒(méi)有大量使用JavaScript，但是對(duì)于開(kāi)發(fā)功能強(qiáng)大、靈活實(shí)用的Web應(yīng)用而言，JavaScript是不可缺少的。開(kāi)發(fā)者應(yīng)該掌握J(rèn)avaScript的基本語(yǔ)法和應(yīng)用，在此基礎(chǔ)上再使用開(kāi)發(fā)工具（如Dreamweaver）自動(dòng)生成完成相應(yīng)功能的JavaScript代碼，提高工作效率。下面介紹了JavaScript的一些基礎(chǔ)知識(shí)，如果

32、要了解完整的JavaScript語(yǔ)法細(xì)節(jié)請(qǐng)參考其它資料。 JavaScript簡(jiǎn)介 JavaScript是一種基于對(duì)象和事件驅(qū)動(dòng)的腳本語(yǔ)言。它可以與HTML超文本標(biāo)記語(yǔ)言、Java小程序一起實(shí)現(xiàn)，做到在一個(gè)Web頁(yè)面中協(xié)同工作，從而增強(qiáng)開(kāi)發(fā)客戶(hù)端的應(yīng)用的能力。JavaScript一般會(huì)嵌入到標(biāo)準(zhǔn)的HTML語(yǔ)言中完成相應(yīng)的功能。JavaScript和Java語(yǔ)言是兩個(gè)公司開(kāi)發(fā)的不同的兩個(gè)產(chǎn)品。Java是SUN公司推出的新一代面向?qū)ο蟮某绦蛟O(shè)計(jì)語(yǔ)言，特別適合于Internet應(yīng)用程序開(kāi)發(fā)，而JavaScript是Netscape公司的產(chǎn)品，其目的是為了擴(kuò)展瀏覽器功能。 JavaScript的代碼是

33、一種文本格式的代碼，可以直接嵌入HTML文檔中，并且可動(dòng)態(tài)裝載。編寫(xiě)HTML文檔就像編輯文本文件一樣方便。 在HTML文檔中，JavaScript使用來(lái)嵌入。語(yǔ)法如下： JavaScript語(yǔ)言代碼序列；下面是一個(gè)例子，在該例子中，當(dāng)用戶(hù)訪問(wèn)該頁(yè)面的時(shí)候，會(huì)利用JavaScript代碼判斷當(dāng)前是上午還是下午并將判斷顯示在屏幕上，黑體部分是嵌入的JavaScript代碼。 JavaScript例子 var tdate=new Date(); nhour= tdate.getHours() if(nhour 12) document.write(早上好!+) else document.write

34、(下午好!+) 2. JavaScript語(yǔ)法基礎(chǔ) JavaScript腳本語(yǔ)言同其它語(yǔ)言一樣，有 它自身的基本數(shù)據(jù)類(lèi)型、表達(dá)式和算術(shù) 運(yùn)算符及程序的基本框架結(jié)構(gòu)。 JavaScript提供了四種基本的數(shù)據(jù)類(lèi)型用 來(lái)處理數(shù)字和文字, 而變量提供存放信息 的地方, 表達(dá)式則可以完成較復(fù)雜的信息 處理 。1）基本數(shù)據(jù)類(lèi)型、常量、變量 在JavaScript中四種基本的數(shù)據(jù)類(lèi)型：數(shù)值（整數(shù)和實(shí)數(shù)）、字符串型（用雙引號(hào)或者單引號(hào)括起來(lái)的字符或數(shù)值）、布爾型（使True或False表示）和空值。 常量包括整型常量、實(shí)型常量、布爾常量和空值型常量。整型常量和其它語(yǔ)言常量類(lèi)似，它可以使用十六進(jìn)制、八進(jìn)制和十

35、進(jìn)制表示其值。 實(shí)型常量是由整數(shù)部分加小數(shù)部分表示，如11193.98,可以用科學(xué)計(jì)數(shù)法表示，如6E3、9e5等。布爾常量只有兩種狀態(tài)：True或False。 字符型常量使用單引號(hào)或雙引號(hào)引起來(lái)的一個(gè)或幾個(gè)字符。如JavaScript is powerful和8723122等。 JavaScript中有一個(gè)空值null,表示什么也沒(méi)有。如果代碼引用沒(méi)有定義的變量,則返回一個(gè)null值。 JavaScript的變量的主要作用是存取數(shù)據(jù)、提供存放信息的容器。對(duì)于變量必須明確變量的命名、變量的類(lèi)型、變量的聲明及其變量的作用域。JavaScript中的變量命名以字母開(kāi)頭，中間可以出現(xiàn)數(shù)字如name1等

36、。除下劃線字符作為連字符外，變量名不能含有空格和其它特殊符號(hào)（如+）， 也不能使用JavaScript中的關(guān)鍵字作為變量。 在JavaScript中，變量可以用var關(guān)鍵字聲明：var username;該聲明語(yǔ)句定義了一個(gè)username變量，但沒(méi)有賦予它的值。 var username =John 該聲明語(yǔ)句定義了一個(gè)username變量, 同時(shí)賦了初值。 在JavaScript中，變量可以先不聲明，而在使用的時(shí)候再根據(jù)實(shí)際數(shù)據(jù)的類(lèi)型來(lái)確定變量的類(lèi)型。例如x=1100 、y=Java 、z= True 、price=118.5等，其中x整數(shù)，y為字符串，z為布爾型，price為實(shí)型。 Ja

37、vaScript中也有全局變量和局部變量。全局變量定義在所有函數(shù)體之外，其作用范圍是整個(gè)函數(shù)；局部變量是定義在函數(shù)體之內(nèi)，只對(duì)該函數(shù)可見(jiàn)，對(duì)其它函數(shù)不可見(jiàn)。 2）JavaScript表達(dá)式和運(yùn)算符 在定義完變量后，就可以對(duì)它們進(jìn)行賦值、修改、計(jì)算等一系列操作，表達(dá)式由常量、變量或運(yùn)算符組成，根據(jù)運(yùn)算的結(jié)果，它可以分為算術(shù)表述式、字串表達(dá)式、賦值表達(dá)式以及布爾表達(dá)式等。 JavaScript的運(yùn)算符基本和其它語(yǔ)言類(lèi)似，包括賦值運(yùn)算符、比較運(yùn)算符、算術(shù)運(yùn)算符、按位運(yùn)算符、邏輯運(yùn)算符和字符串運(yùn)算符等。 3）JavaScript程序控制流 JavaScript包括條件語(yǔ)句、循環(huán)語(yǔ)句用于控制程序執(zhí)行流程

38、，語(yǔ)法基本同java的語(yǔ)法。條件語(yǔ)句有if.else 和 switch。循環(huán)語(yǔ)句有for、while、do while。4） JavaScript函數(shù) 函數(shù)是 JavaScript 中最基本的程序單元，函數(shù)的定義語(yǔ)法如下：Function 函數(shù)名(參數(shù)列表) 函數(shù)體;. Return 表達(dá)式; 它包括：函數(shù)的名稱(chēng)函數(shù)的參數(shù)，包含在由逗號(hào)分開(kāi)的圓括號(hào)內(nèi)函數(shù)體，包含在一對(duì)大括號(hào)內(nèi) 一個(gè)簡(jiǎn)單函數(shù)的原型示例如下： function square(num) return num * num;一般在HTML文檔的頭部定義函數(shù)，以便當(dāng)文檔被裝載時(shí)函數(shù)首先載入。JavaScript本身預(yù)定義了一些函數(shù)，通過(guò)這

39、些函數(shù)可以完成一些通用的功能。 5）JavaScript事件驅(qū)動(dòng)及事件處理 JavaScript不是面向?qū)ο蟮恼Z(yǔ)言，但是它是基于對(duì)象的語(yǔ)言。基于對(duì)象的基本特征是采用事件驅(qū)動(dòng)。通常鼠標(biāo)、熱鍵的動(dòng)作或者其它事情發(fā)生稱(chēng)之為事件，由鼠標(biāo)或熱鍵的操作等引發(fā)的一連串程序的動(dòng)作，稱(chēng)之為事件驅(qū)動(dòng)。一般對(duì)發(fā)生的事件進(jìn)行處理的程序或函數(shù)稱(chēng)為事件處理程序。 JavaScript不是面向?qū)ο蟮恼Z(yǔ)言，但是它是基于對(duì)象的語(yǔ)言?；趯?duì)象的基本特征是采用事件驅(qū)動(dòng)。通常鼠標(biāo)、熱鍵的動(dòng)作或者其它事情發(fā)生稱(chēng)之為事件，由鼠標(biāo)或熱鍵的操作等引發(fā)的一連串程序的動(dòng)作，稱(chēng)之為事件驅(qū)動(dòng)。一般對(duì)發(fā)生的事件進(jìn)行處理的程序或函數(shù)稱(chēng)為事件處理程序。

40、下面給出JavaScript處理的一些通過(guò)鼠標(biāo)或熱鍵的動(dòng)作引發(fā)的事件。它主要處理以下幾個(gè)事件： 鼠標(biāo)單擊事件onClick 用戶(hù)用鼠標(biāo)單擊以下對(duì)象時(shí)，會(huì)產(chǎn)生onClick事件。button（按鈕對(duì)象） checkbox（復(fù)選按鈕） radio （單選按鈕） reset buttons（重新填寫(xiě)Form按鈕） submit buttons（提交按鈕） 通過(guò)在這些對(duì)象（Form子標(biāo)記）的屬性onClick里面可以指定的事件處理程序或代碼，用戶(hù)可以使用自寫(xiě)函數(shù)進(jìn)行事件處理，也可以調(diào)用JavaScript中內(nèi)部的函數(shù)或者直接書(shū)寫(xiě)JavaScript的代碼來(lái)處理。 例1：下例實(shí)現(xiàn)了用戶(hù)點(diǎn)擊按鈕時(shí)由Sub

41、mitChange函數(shù)給出響應(yīng)的功能。 例2：下例實(shí)現(xiàn)了用戶(hù)點(diǎn)擊按鈕時(shí)由JavaScript內(nèi)部函數(shù)alert給出響應(yīng)。 文本框內(nèi)容改變事件onChange 當(dāng)Text或TextArea文本框元素輸入的字符值改變時(shí)該事件發(fā)生；另外，選中select下拉列表框一個(gè)不同選項(xiàng)時(shí)也會(huì)引發(fā)該事件。例如，下例當(dāng)文本框內(nèi)容改變時(shí)，會(huì)調(diào)用用戶(hù)的check函數(shù)去檢查郵政編碼格式是否正確。 其它常用的事件如下選中事件onSelect：當(dāng)Text或TextArea對(duì)象中的文字被加亮后，引發(fā)該事件。 獲得焦點(diǎn)事件onFocus：當(dāng)用戶(hù)單擊Text或TextArea以及select對(duì)象時(shí)，產(chǎn)生該事件。此時(shí)該對(duì)象成為激活

42、對(duì)象。 失去焦點(diǎn)onBlur：當(dāng)Text對(duì)象或TextArea對(duì)象以及select對(duì)象不再擁有焦點(diǎn)、而退到后臺(tái)時(shí)，引發(fā)該事件，他與onFocus事件是一個(gè)對(duì)應(yīng)的關(guān)系。 載入文件onLoad：當(dāng)瀏覽器打開(kāi)HTML文檔時(shí)，產(chǎn)生該事件。比如，onLoad的一個(gè)作用就是在首次載入一個(gè)文檔時(shí)檢測(cè)cookie的值，并用一個(gè)變量為其賦值，使它可以被源代碼使用。 卸載文件onUnload：當(dāng)Web頁(yè)面退出時(shí)引發(fā)onUnload事件，并可更新Cookie的狀態(tài)。通常情況下，JavaScript中對(duì)于對(duì)象事件的處理通常由用戶(hù)自定義函數(shù)來(lái)處理。 6）JavaScript面向?qū)ο蟮幕咎卣?JavaScript沒(méi)有提

43、供諸如抽象、繼承、重 載等有關(guān)面向?qū)ο笳Z(yǔ)言的許多功能，所 以它不是面向?qū)ο蟮恼Z(yǔ)言。盡管如此， JavaScript還是具有面向?qū)ο蟮幕咎?征，JavaScript可以根據(jù)需要?jiǎng)?chuàng)建自己的 對(duì)象。 JavaScript中的對(duì)象是由屬性和方法構(gòu)成 的，可以通過(guò)以下方法創(chuàng)建一個(gè)對(duì)象進(jìn) 而使用它： 引用JavaScript內(nèi)部對(duì)象 獲取由瀏覽器環(huán)境中提供的HTML相關(guān)的對(duì)象 創(chuàng)建新的對(duì)象其中，JavaScript有下列常用的內(nèi)部對(duì)象： 1.串對(duì)象 string string對(duì)象主要用于有關(guān)字符串在Web頁(yè)面中的顯示、字體大小、字體顏色、字符的搜索以及字符的大小寫(xiě)轉(zhuǎn)換。string對(duì)象的方法細(xì)節(jié)參考其它

44、資料。2.數(shù)學(xué)計(jì)算的math對(duì)象 Math對(duì)象主要提供除加、減、乘、除以外的一些數(shù)學(xué)運(yùn)算，如對(duì)數(shù)，平方根等。3.日期及時(shí)間對(duì)象日期及時(shí)間對(duì)象提供了有關(guān)日期和時(shí)間的對(duì)象，使用前通過(guò)new運(yùn)算符創(chuàng)建一個(gè)對(duì)象（如語(yǔ)句myDate=New Date()；）。Date對(duì)象提供了方法獲取和設(shè)置日期和時(shí)間。4.瀏覽器的內(nèi)部對(duì)象（HTML對(duì)象）3.用JavaScript操作瀏覽器的內(nèi)部對(duì)象 1）瀏覽器的內(nèi)部對(duì)象 瀏覽器的內(nèi)部對(duì)象有很多，如窗口對(duì)象window、文檔對(duì)象document和Form對(duì)象等。window窗口對(duì)象可以讓JavaScript去處理瀏覽器窗口的方法和屬性；document文檔對(duì)象把HTML

45、的一些基本的元素（如鏈接、錨和Form等）包裝起來(lái)，提供給編程人員使用；form對(duì)象可以使設(shè)計(jì)人員用JavaScript 去直接訪問(wèn)HTML文檔中的Form，這樣可以實(shí)現(xiàn)動(dòng)態(tài)改變Web文檔的行為。當(dāng)瀏覽器打開(kāi)一個(gè)網(wǎng)頁(yè)的時(shí)候，如果網(wǎng)頁(yè)包含相應(yīng)的元素（如鏈接等），那么瀏覽器就會(huì)準(zhǔn)備好這些對(duì)象，JavaScript語(yǔ)言也就可以通過(guò)這些對(duì)象去操作網(wǎng)頁(yè)里面的元素了。 2）瀏覽器的Form對(duì)象 下面主要介紹Form對(duì)象，F(xiàn)orm對(duì)象是文檔對(duì)象的一個(gè)元素，通過(guò)document.forms數(shù)組來(lái)訪問(wèn)同一個(gè)頁(yè)面上的多個(gè)Form對(duì)象,使用forms數(shù)組要比使用窗體名字要方便得多。假設(shè)下面是一個(gè)網(wǎng)頁(yè)里面嵌入的兩個(gè)F

46、orm： 當(dāng)包含該Form的網(wǎng)頁(yè)被瀏覽器打開(kāi)后，可以通過(guò)以下兩種方法訪問(wèn)unregister兩個(gè)Form:通過(guò)名字: 如document.register 去訪問(wèn)register這個(gè)Form（注意：不要忘記前面的document）。通過(guò)Form數(shù)組： 如使用document.forms0去訪問(wèn)第一個(gè)Form (名字為register的Form)，forms0中共有三個(gè)子元素，而Forms1中只有兩個(gè)子元素。 一個(gè)From中包含的子元素可能包括按鈕、單選按鈕、復(fù)選按鈕、提交按鈕、重置按鈕、文本框等組成，要訪問(wèn)這些子元素（如文本框）可以通過(guò)對(duì)應(yīng)特定的子元素的數(shù)組（elements）下標(biāo)或子元素的名

47、字來(lái)實(shí)現(xiàn)，而每一個(gè)子元素主要是通過(guò)該元素的屬性或方法來(lái)引用，所以掌握這些子元素的屬性和方法非常重要。下面是訪問(wèn)它們的基本格式：formName.elements.methadName (Form名.元素名或數(shù)組.方法) formNpertyName(Form名.元素名或數(shù)組.屬性)3）實(shí)例 為了有一個(gè)更直觀的認(rèn)識(shí)，下面我們給出1個(gè)例子，該例子當(dāng)點(diǎn)擊提交按鈕后，對(duì)name文本框進(jìn)行檢查，如果沒(méi)有輸入name，給出提示。該例子使用JavaScript實(shí)現(xiàn)。完整的代碼例子如下： function CheckForm() if (document.register.n1

48、.value.length = 0) alert(請(qǐng)輸入您姓名!); return false; else return true; 通過(guò)JavaScrpit操作Form 注意以下幾點(diǎn)：嵌入了一個(gè)JavaScript函數(shù)，函數(shù)定義位置在之間。document.register.n1.value.length 去得到register這個(gè)Form的n1文本框的輸入內(nèi)容（value）的字符串長(zhǎng)度（length）。點(diǎn)擊名字為n3的提交按鈕會(huì)調(diào)用CheckForm（）函數(shù)（onclick函數(shù)）。如果輸入n1為空，提示一個(gè)對(duì)話框后，文本框n1是register的子元素，整個(gè)HTML文檔對(duì)象（documen

49、t）包含一個(gè)Form（register）。 第四章內(nèi)容第一節(jié).C/S結(jié)構(gòu)向B/S結(jié)構(gòu)演化 第二節(jié).基于HTML的客戶(hù)端開(kāi)發(fā)技術(shù)第三節(jié).基于JavaScript的客戶(hù)端開(kāi)發(fā)技術(shù)第四節(jié).其它客戶(hù)端開(kāi)發(fā)技術(shù)第四節(jié) 其它客戶(hù)端開(kāi)發(fā)技術(shù) 1. Applet在客戶(hù)端開(kāi)發(fā)的應(yīng)用 1）Applet簡(jiǎn)介 Applet 實(shí)際上是嵌入到HTML頁(yè)面中在瀏覽器執(zhí)行的一個(gè)Java程序，Applet的設(shè)計(jì)和實(shí)現(xiàn)遵守一定的規(guī)范，它包含1個(gè)主類(lèi)（繼承java.Applet.Applet類(lèi)），可能包含0個(gè)或者多個(gè)其它類(lèi)。Applet可以單獨(dú)工作，也可以和HTML及JavaScript技術(shù)組合使用。下面是在網(wǎng)頁(yè)中插入Java A

50、pplet語(yǔ)法： Applet完全采用Java語(yǔ)言實(shí)現(xiàn)，許多專(zhuān)業(yè)人員更擅長(zhǎng)利用Java已提供的豐富的功能來(lái)進(jìn)行客戶(hù)端編程。Applet具有幾乎所有傳統(tǒng)的Java應(yīng)用程序的功能，比如，可以用來(lái)制作圖形以及應(yīng)用程序中的用戶(hù)界面；可以使用Java豐富的網(wǎng)絡(luò)相關(guān)的編程類(lèi)等。如果使用得當(dāng)，前面提到的HTML和JavaScript不容易滿足的需求都可以用Applet來(lái)解決或緩解。Applet保存在服務(wù)器上，每次瀏覽器訪問(wèn)包含Applet的網(wǎng)頁(yè)的時(shí)候，客戶(hù)機(jī)會(huì)自動(dòng)下載Applet文件并執(zhí)行。Applet和它的類(lèi)文件是通過(guò)標(biāo)準(zhǔn)的HTTP請(qǐng)求傳輸?shù)娇蛻?hù)端的瀏覽器上的，所以Applet可以越過(guò)web頁(yè)面數(shù)據(jù)所在的

51、平臺(tái)的防火墻進(jìn)行發(fā)送。對(duì)于Applet應(yīng)用的更新類(lèi)似于HTML網(wǎng)頁(yè)組成的應(yīng)用的更新，它只需在服務(wù)器上安裝最新的Applet類(lèi)和支持庫(kù)，安裝和維護(hù)簡(jiǎn)單，成本較低。 當(dāng)然，Applet也有一些缺點(diǎn)和限制： 每次訪問(wèn) Applet 時(shí)，必須將 Applet 類(lèi)和所支持的庫(kù)下載到客戶(hù)機(jī)。如果類(lèi)和庫(kù)較大，那么程序初始化較慢。 Applet代碼從Web主機(jī)上下載并在訪問(wèn)者機(jī)器上的瀏覽器中執(zhí)行。如果不做限制，一些惡意的Applet可能會(huì)對(duì)客戶(hù)機(jī)進(jìn)行破壞。為了防止這樣的Applet，Applet受到安全方面的約束，那就是Applet只可以與提供這個(gè)Applet的主機(jī)進(jìn)行通信，而且Applet不能操作最終用戶(hù)的

52、機(jī)器。當(dāng)然開(kāi)發(fā)者可以利用數(shù)字簽名技術(shù)對(duì)Applet進(jìn)行簽名，這樣如果用戶(hù)同意給予Applet權(quán)限，那么就可以突破這種限制。 Applet可與提供Applet類(lèi)的主機(jī)建立網(wǎng)絡(luò)連接，但是Applet不能建立或接受其它外來(lái)的socket連接。在Java平臺(tái)下開(kāi)發(fā)企業(yè)級(jí)Web應(yīng)用的一種被推薦的規(guī)范是：在客戶(hù)端使用Applet和HTML，而在服務(wù)器端使用Servlet、JSP和EJB等其他技術(shù)。這種體系結(jié)構(gòu)的關(guān)鍵是在客戶(hù)端的Applet和服務(wù)器端的Servlet等之間的通信。當(dāng)然，是否選用這種模式，應(yīng)該是一個(gè)綜合的考慮，使用Applet和僅使用HTML的優(yōu)點(diǎn)和缺點(diǎn)都很明顯，在實(shí)際應(yīng)用開(kāi)發(fā)中要根據(jù)應(yīng)用本身的特點(diǎn)和人員的能力來(lái)確定開(kāi)發(fā)技術(shù)。在客戶(hù)端開(kāi)發(fā)考慮上，開(kāi)發(fā)人員可以只使用HTML，也可以組合使用HTML、JavaScript和Applet。 2）Applet客戶(hù)端開(kāi)發(fā)中的應(yīng)用 Applet作為Web應(yīng)用的客戶(hù)端在系統(tǒng)設(shè)計(jì)時(shí)關(guān)鍵要考慮Applet和服務(wù)器上的Servlet、JSP、CGI等程序之間的通信方