【正文】 起的網(wǎng)絡(luò) 。 現(xiàn)在 ， 幾乎所有的美國(guó)公司 （ 包括一些家庭 ） 均在網(wǎng)絡(luò)上設(shè)立了自己的 Web服務(wù)器 。虛擬主機(jī)服務(wù)提供者的服務(wù)器硬件構(gòu)成的性能比較高 ， 通訊線路也比較通暢 ， 可以達(dá)到非常高的數(shù)據(jù)傳輸速度 （ 可達(dá) 45Mb/s） ， 為用戶提供了一個(gè)良好的外部環(huán)境；用戶還不用負(fù)責(zé)機(jī)器硬件的維護(hù) 、 軟件設(shè)置 、 網(wǎng)絡(luò)監(jiān)控 、文件備份等工作 。 返 回 第 8章 網(wǎng)頁制作技術(shù) 首頁 結(jié)束 2022年 10月 23日星期日 大學(xué)計(jì)算機(jī)基礎(chǔ)教程 17 WEB服務(wù)器 服務(wù)器托管即租用 ISP機(jī)架位置 ， 建立企業(yè) Web服務(wù)系統(tǒng) 。 企業(yè)主機(jī)放置在ISP機(jī)房?jī)?nèi) ， 由 ISP分配 IP地址 ， 提供必要的維護(hù)工作 ， 由企業(yè)自己進(jìn)行主機(jī)內(nèi)部的系統(tǒng)維護(hù)及數(shù)據(jù)的更新 。 這種方式特別適用于有大量數(shù)據(jù)需要通過因特網(wǎng)進(jìn)行傳遞 ， 以及有大量信息需要發(fā)布的單位 。 返 回 第 8章 網(wǎng)頁制作技術(shù) 首頁 結(jié)束 2022年 10月 23日星期日 大學(xué)計(jì)算機(jī)基礎(chǔ)教程 18 客戶端腳本語言 HTML（ DHTML、 Dynamic HTML） （ 1/4） ⑴ DHTML Dynamic HTML是一種制作網(wǎng)頁的方式 ， 既不是一種網(wǎng)絡(luò)技術(shù) ， 也不是一個(gè)標(biāo)記或插件 。 它可以通過 JavaScript、 VBScript、 Document Object Modle（ DOM） 、 layers或者 CSS來實(shí)現(xiàn) 。 DHTML能改變頁面中的一些效果 ， 但不保證在不同的瀏覽器上有相同的效果 。 典型的 DHTML例子就是當(dāng)鼠標(biāo)移到一幅圖片的上面時(shí) ， 該圖片變?yōu)榱硪环鶊D片 。 至于怎樣讓瀏覽器實(shí)現(xiàn)了這樣的變化 ， 就是 DHTML中所包含的技術(shù) 。 ⑵ 客戶端的腳本語言 經(jīng)常見到的客戶端腳本語言 （ 如 JavaScript和 VBScript） 就是 DMTML的內(nèi)容之一 。 在 Microsoft和 Netscape發(fā)布的 ， 允許使用腳本語言去改變 HTML語言中大多數(shù)的元素 。 能夠被腳本語言改變的頁面元素是符合文檔對(duì)象模型 （ Document Object Model） 的 。 返 回 第 8章 網(wǎng)頁制作技術(shù) 首頁 結(jié)束 2022年 10月 23日星期日 大學(xué)計(jì)算機(jī)基礎(chǔ)教程 19 客戶端腳本語言 HTML（ DHTML、 Dynamic HTML） （ 2/4） ⑶ 文檔對(duì)象模型 DOM是 dynamic HTML中的核心內(nèi)容或基礎(chǔ) ， 是它使得 HTML代碼能夠被改變 。實(shí)際上就是將 HTML文檔及其中的 HTML元素等對(duì)象化 ， 并開放給腳本語言 ，瀏覽器就可以執(zhí)行語言腳本來改變這些元素了 （ IE4開始 ） 。 當(dāng)然不是所有元素都能被改變的 。 ⑷ 事件模型 在 DOM中有一部分內(nèi)容 ， 專門用來指定什么元素能夠改變 ， 這就是事件模型 。 所謂事件就是對(duì)作用于計(jì)算機(jī)的用戶行為和系統(tǒng)行為的一個(gè)抽象 ， 抽象的邏輯結(jié)果就是計(jì)算機(jī)的動(dòng)作都是由事件觸發(fā)的 。 例如 ， 因?yàn)槭髽?biāo)雙擊了一個(gè)文件圖標(biāo) ， 系統(tǒng)才打開了這個(gè)文件 。 即使是在網(wǎng)頁中 ， 也抽象了幾乎所有的事件 。 如：把鼠標(biāo)放在一個(gè)頁面元素上 （ onmouseover） ， 加載一個(gè)頁面 （ onload） ， 提交一個(gè)表單（ onsubmit） ， 在表單的文字輸入部分用鼠標(biāo)點(diǎn)擊一下 （ onfocus） 等等 。表 81列出了一些主要的事件 。 返 回 第 8章 網(wǎng)頁制作技術(shù) 首頁 結(jié)束 2022年 10月 23日星期日 大學(xué)計(jì)算機(jī)基礎(chǔ)教程 20 客戶端腳本語言 HTML（ DHTML、 Dynamic HTML） （ 3/4） 返 回 網(wǎng)頁主要事件一覽表 事件 發(fā)生的時(shí)機(jī) 典型對(duì)象 onAbort 訪問者中斷瀏覽器正在載入圖像的操作 IMG標(biāo)簽定義的 image對(duì)象 onBlur 失去鍵盤輸入焦點(diǎn) 文本框等 onChange 輸入值發(fā)生變化 文本框等 onClick 鼠標(biāo)單擊 按鈕、鏈接 onError 網(wǎng)頁或圖像載入產(chǎn)生錯(cuò)誤 Image、 window對(duì)象 onFocus 獲得鍵盤輸入焦點(diǎn) 文本框等 onKeyDown 鍵盤按下 文本框等 onKeyUp 鍵盤松開 文本框等 onKeyPress 鍵盤一次有效按鍵 文本框等 onLoad 一圖像或網(wǎng)頁載入完成時(shí) Image、 window對(duì)象 onMouseDown 按下鼠標(biāo) onMouseUp 松開鼠標(biāo) onMouseMove 鼠標(biāo)在指定元素上移動(dòng)時(shí) onMouseOut 鼠標(biāo)從指定元素上移開 onMouseOver 鼠標(biāo)進(jìn)入指定元素時(shí) Area、 Link對(duì)象 onMove 窗體或框架移動(dòng)時(shí) window or frame onReset 表單內(nèi)容重置時(shí) onResize 改變?yōu)g覽器或框架大小 window or frame onSelect 選擇文本框中的文本時(shí) 文本框等 onSubmit 按下 Submit按鈕 onUnload 網(wǎng)頁卸載 Window對(duì)象 第 8章 網(wǎng)頁制作技術(shù) 首頁 結(jié)束 2022年 10月 23日星期日 大學(xué)計(jì)算機(jī)基礎(chǔ)教程 21 客戶端腳本語言 HTML（ DHTML、 Dynamic HTML） （ 4/4） ⑸ 級(jí)聯(lián)樣式表 CSS 因?yàn)?CSS是 DOM中的一部分 ， 其實(shí)就是 DOM使用 CSS表示對(duì)象的屬性 ， 因而也是 DHTML的主要方式 ， 所以讓腳本語言能夠改變 CSS中的一些屬性 。 通過改變 CSS， 就能夠改變頁面中的許多顯示效果 。 這些效果包括顏色 、 位置以及大小等 。 基于以上的說法可以看出 ， 動(dòng)態(tài) HTML主要的表現(xiàn)形式就是使用腳本語言來改變頁面元素 ， 其基礎(chǔ)是改變 DOM對(duì)象的屬性值 ， 包括 HTML語言中規(guī)定的頁面元素的屬性和 DOM規(guī)定的 CSS屬性 。 CSS的內(nèi)容后面敘述 ， 本小節(jié)概括介紹一下腳本語言中的一種 ——JavaScript， 它的語法與 Java語言相似 ， 也僅僅是相似 ， 其實(shí)差別也不小 ，另外 JavaScript和 Java語言根本就沒有關(guān)系 。 返 回 第 8章 網(wǎng)頁制作技術(shù) 首頁 結(jié)束 2022年 10月 23日星期日 大學(xué)計(jì)算機(jī)基礎(chǔ)教程 22 客戶端腳本語言 （ 1/5） 使用客戶端腳本語言 ， 原則上是需要了解一些程序設(shè)計(jì)知識(shí)的 。 對(duì)于本書的讀者 ， 一般是沒有程序設(shè)計(jì)基礎(chǔ)和愛好的 ， 雖然如此 ， 由于腳本語言和標(biāo)準(zhǔn)的程序設(shè)計(jì)語言不同 ， 編寫的代碼都是片斷 （ 腳本 ） 、 語法靈活 、 很多情況下不需要有什么完整的程序設(shè)計(jì)思想 ， 所以入門還是容易的 。 這也是像 VB這樣的軟件開發(fā)工具那么容易入門 、 現(xiàn)在容易改行并能夠號(hào)稱程序員的人如此之多的原因之一吧 ！ ⑴ JavaScript的主要作用 ① 應(yīng)用于 B/S結(jié)構(gòu)的應(yīng)用程序 ， 由瀏覽器負(fù)責(zé)解釋執(zhí)行 。 ② 替代服務(wù)器解決一些可以在客戶端完成的工作 ， 如數(shù)據(jù)驗(yàn)證工作 。 ③ 瀏覽器端網(wǎng)頁及瀏覽器的動(dòng)態(tài)控制 。 ④ 只限于在瀏覽器范圍內(nèi) （ 理論上不能打開 、 讀寫和保存用戶計(jì)算機(jī)上的文件 ） 。 返 回 第 8章 網(wǎng)頁制作技術(shù) 首頁 結(jié)束 2022年 10月 23日星期日 大學(xué)計(jì)算機(jī)基礎(chǔ)教程 23 客戶端腳本語言 （ 2/5） ⑵ JavaScript示例 以下給出幾個(gè) JavaScript應(yīng)用示例 ， 并給出有關(guān)的事件 、 對(duì)象 、 代碼等內(nèi)容 。 ① 顯示一個(gè)消息框 本例在網(wǎng)頁加載之后顯示一個(gè)消息框 ， 提示操作者 “ 此賬號(hào)已經(jīng)被人注冊(cè) ，請(qǐng)選擇其它賬號(hào) ！ ” 。 網(wǎng)頁加載事件： onload； 適用的頁面元素： body； 消息框函數(shù)： alert()； JavaScript腳本： alert(‘此賬號(hào)已經(jīng)被人注冊(cè) ， 請(qǐng)選擇其它賬號(hào) ！ ’ )； HTML代碼形式： body onload=alert(‘此賬號(hào)已經(jīng)被人注冊(cè) ， 請(qǐng)選擇其它賬號(hào) ！ ’ )。 返 回 第 8章 網(wǎng)頁制作技術(shù) 首頁 結(jié)束 2022年 10月 23日星期日 大學(xué)計(jì)算機(jī)基礎(chǔ)教程 24 客戶端腳本語言 （ 3/5） ⑵ JavaScript示例 ② 改變圖片 本例在鼠標(biāo)點(diǎn)擊一個(gè)圖片的時(shí)候改變圖片 。 鼠標(biāo)點(diǎn)擊事件： onclick； 采用的頁面元素： img； 操作屬性：圖像對(duì)象 imga的 src屬性； JavaScript腳本： =‘image/’； HTML代碼形式： img id=imga src=image/ onclick==‘image/’ 返 回 第 8章 網(wǎng)頁制作技術(shù) 首頁 結(jié)束 2022年 10月 23日星期日 大學(xué)計(jì)算機(jī)基礎(chǔ)教程 25 客戶端腳本語言 （ 4/5） ③ 操作提問 本例在點(diǎn)擊刪除按鈕時(shí)候給出提問 。 鼠標(biāo)點(diǎn)擊事件： onclick； 頁面元素： input（ 表單域 ） 元素類型：按鈕 button； 按鈕所在表單： formCourse； 對(duì)話框函數(shù)： confirm()； 提交函數(shù)： submit()； JavaScript腳本： if((‘ 刪 除 此 條 記 錄 嗎 ？ ’ )) ()； HTML代碼形式： input type=button class=button1 name=btn32 value=刪除 onclick= if((‘ 刪 除 此 條 記 錄 嗎 ？ ’ )) () 返 回 第 8章 網(wǎng)頁制作技術(shù) 首頁 結(jié)束 2022年 10月 23日星期日 大學(xué)計(jì)算機(jī)基礎(chǔ)教程 26 客戶端腳本語言 （ 5/5） ④ 禁止鼠標(biāo)右鍵的操作 本例針對(duì)一個(gè)單元格 ， 禁止鼠標(biāo)右鍵的所有操作 。 鼠標(biāo)右鍵快捷菜單事件： oncontextmenu； 采用的頁面元素： td（ 單元格 ） 交互函數(shù)： return()； JavaScript腳本： return(false)； HTML代碼形式： td height=20 oncontextmenu=return(false) A href= 主頁/A/td 通過以上幾個(gè)示例的研究 ， 讀者應(yīng)該基本上了解了簡(jiǎn)單有效的 JavaScript形式 。 當(dāng)然 ， 這只是 JavaScript語言冰山的一角 。 對(duì) JavaScript略感興趣的讀者 ， 可以閱讀一下本小節(jié)后面的內(nèi)容 。 這里簡(jiǎn)述一下 JavaScript語言的各種元素 ， 還要深入研究的讀者請(qǐng)查找有關(guān)資料 。 返 回 第 8章 網(wǎng)頁制作技術(shù) 首頁 結(jié)束 2022年 10月 23日星期日 大學(xué)計(jì)算機(jī)基礎(chǔ)教程 27 客戶端腳本語言 （ 4種基本數(shù)據(jù)類型和對(duì)象類型 ） ： ① 數(shù)值 ② 布爾型 （ true、 false） ③ 字符串 （ 單 、 雙引號(hào)都行 ， 支持 /轉(zhuǎn)義 ） ④ 空值 （ null） ， 應(yīng)說是無類型 ⑤ 對(duì)象 javascript變量的數(shù)據(jù)類型屬于弱類型 ， 可以不聲明 ， 變量類型隨時(shí)隨地受賦值影響 。 返 回 第 8章 網(wǎng)頁制作技術(shù) 首頁 結(jié)束 2022年 10月 23日星期日 大學(xué)計(jì)算機(jī)基礎(chǔ)教程 28 客戶端腳本語言 、 運(yùn)算符 、 控制語句 變量可以使用 var語句來進(jìn)行聲明： var 變量名 = 初值 。 變量命名規(guī)則： 第一個(gè)字符必須是一個(gè)字母 （ 大小寫均可 ） 、 或一個(gè)下劃線 （ _） 或一個(gè)美元符 （ $） 。后續(xù)的字符可以是字母 、 數(shù)字 、 下劃線或美元符 。 全局變量是在函數(shù)體之外定義或使用的變量 。 局部變量是在函數(shù)體內(nèi)部定義或使用的變量 。 運(yùn)算符與 c、 Java基本一致 。 控制語句 if、 for、 while語句結(jié)構(gòu)和 c、 Java基本一致 。 返 回 第 8章 網(wǎng)頁制作技術(shù) 首頁 結(jié)束 2022年 10月 23日星期日 大學(xué)計(jì)算機(jī)基礎(chǔ)教程 29 客戶端腳本語言 ⑴ 函數(shù)定義 function