【正文】 以在程序中控制頁面轉(zhuǎn)向某一個(gè)網(wǎng)頁歷史記錄。例如 (4)用來顯示后退 4步后的網(wǎng)頁歷史， (4)用來顯示前進(jìn) 4個(gè)頁面后的網(wǎng)頁歷史。如果當(dāng)前頁面后的歷史記錄只有 2步，雖然設(shè)定了前進(jìn) 4步，沒有那么多，則顯示最后一個(gè)網(wǎng)頁歷史。 back和forward方法的實(shí)現(xiàn)后退和前進(jìn)一步的功能，等同于(1)和 (1)。 [例 ] 使用 History對象設(shè)置頁面鏈接 實(shí)現(xiàn)代碼： 運(yùn)行效果 ： HTML DOM程序設(shè)計(jì)初步 事件對象 5. 事件對象 (event) event對象是 window對象的子對象，主要作用就是獲取或者設(shè)置產(chǎn)生事件的對象是哪個(gè)對象、鍵盤按鍵的狀態(tài)、當(dāng)前鼠標(biāo)指針的位置、鼠標(biāo)按鍵的狀態(tài)等等。其常用的屬性見表 46所示。 HTML DOM程序設(shè)計(jì)初步 事件對象 [例 ] 使用 srcElement屬性，判斷按下了哪個(gè)元素。 實(shí)現(xiàn)代碼： 運(yùn)行效果： HTML DOM程序設(shè)計(jì)初步 文檔對象 (Document) 6. 文檔對象 (Document) document文檔對象是瀏覽器對象的核心，主要作用就是把這些基本的元素（如 links,anchor等）包裝起來，提供給編程人員使用。編程人員利用這些對象，可以對 WWW瀏覽器環(huán)境中的事件進(jìn)行控制并作出處理。在 JavaScript中提供了非常豐富的內(nèi)部方法和屬性，從而減輕了編程人員的工作，提高了編程效率。 document對象對于我們實(shí)現(xiàn) Web頁面信息交互起關(guān)鍵作用。 document對象所包含的屬性、方法、事件、對象如圖 410所示。 HTML DOM程序設(shè)計(jì)初步 文檔對象 (Document) HTML DOM程序設(shè)計(jì)初步 文檔對象 (Document) document對象包含的屬性、方法、事件及子對象眾多，詳盡介紹具體的使用方法請參閱其它資料。下面主要介紹常用的屬性、方法、事件和對象。 ? document對象的常用屬性見表 47所示。 Cookie是放在瀏覽器緩存中的一個(gè)文件，里面存放著各個(gè)參數(shù)名以及對應(yīng)的參數(shù)值。 Cookie中的參數(shù)是以分號(hào)相隔的，例如 name=20。sex=male。color=red。expires=Sun May 27 22:04:25 UTC+0800 2022。用戶在打開同一個(gè)網(wǎng)站時(shí)，通過鏈接方式可能打開了多個(gè)瀏覽器窗口，這些窗口間需要共享信息時(shí)， cookie就可以完成這項(xiàng)工作。 Cookie存放的內(nèi)容可以設(shè)置失效期限，既可以永久保留，也可以關(guān)閉網(wǎng)站后刪除，也可以在指定時(shí)間內(nèi)失效，通過 expires指定cookie的失效日期，當(dāng)沒有失效日期時(shí)，關(guān)閉瀏覽器即失效。我們可以保存用戶輸入的參數(shù)到 cookie中，以后可以恢復(fù)顯示。例如在登錄一個(gè)系統(tǒng)時(shí)，需要用戶從學(xué)生、科任教師、班主任、輔導(dǎo)員中選擇一種用戶類型登錄，通過 cookie保存選定的用戶類型后，以后再次登錄系統(tǒng)，就不要再讓用戶選擇用戶類型，可從 cookie中取出設(shè)定的用戶類型作為默認(rèn)值。 HTML DOM程序設(shè)計(jì)初步 文檔對象 (Document) HTML DOM程序設(shè)計(jì)初步 文檔對象 (Document) [例 ] 設(shè)置 cookie和獲取 cookie的例子。該例子有兩個(gè)通用的函數(shù) setCookie和 getCookie分別設(shè)置和獲取 cookie。用戶在文本框中輸入姓名，單擊按鈕“姓名保存到 cookie”后，再單擊“從 cookie中得到姓名”按鈕，在第二個(gè)文本框中顯示取到的姓名。 實(shí)現(xiàn)代碼： 運(yùn)行效果： HTML DOM程序設(shè)計(jì)初步 文檔對象 (Document) ? document對象的常用方法見表 48所示。 文檔對象的方法 write和 writeln方法主要用來實(shí)現(xiàn)在Web頁面上顯示輸出信息。在實(shí)際使用中， writeln()與write()唯一不同之處在于在尾部加了一個(gè)換行符。 open方法有兩種用法： 與 ()用法完全一致，用來創(chuàng)建一個(gè)新的窗口或在指定的命令窗口內(nèi)打開文檔； 在一個(gè)已存在文件中寫入內(nèi)容或創(chuàng)建一個(gè)新文件來寫入內(nèi)容。在完成對 Web文檔的寫操作后，要使用 close()方法來實(shí)現(xiàn)對輸出流的關(guān)閉。在使用 open()來打開一個(gè)新流時(shí)，可為文檔指定一個(gè)有效的文檔類型，有效文檔類型包括text/HTML、 text/gif、 text/xim、 text/plugin等。 HTML DOM程序設(shè)計(jì)初步 文檔對象 (Document) HTML DOM程序設(shè)計(jì)初步 文檔對象 (Document) [例 ] 文檔對象 write、 open、 close方法示例。單擊 Finish Sentence按鈕原地輸出另外一個(gè)頁面。單擊“打開新窗口”按鈕打開 首頁。 實(shí)現(xiàn)代碼： 運(yùn)行效果： HTML DOM程序設(shè)計(jì)初步 文檔對象 (Document) ? document對象的事件 文檔對象的事件除了響應(yīng)鍵盤、鼠標(biāo)常規(guī)操作事件外，還增加了其它大量事件，例如鼠標(biāo)的拖拉操作事件（ ondrag、ondragend、 ondragenter、 ondragleave、 ondragover、ondragstart、 ondrop）、右鍵菜單事件 oncontextmenu等。例如以下代碼實(shí)現(xiàn)了在瀏覽器窗口文本塊 span區(qū)域，按下鼠標(biāo)右鍵時(shí)將不出現(xiàn)右鍵菜單。 SPAN STYLE=width:300。 backgroundcolor:blue。 color:white。 oncontextmenu=return false PThe context menu never displays when you rightclick in this box./P /SPAN HTML DOM程序設(shè)計(jì)初步 文檔對象 (Document) ?document的對象 document所包含的對象主要是集合對象，包括 all、anchors、 applets、 childNodes、 embeds、 forms、frames、 images、 links、 namespaces、 scripts、styleSheets等。例如以下代碼演示了 all的用法： var oItem = 。 //得到頁面中得所有對象，并顯示每個(gè)對象對應(yīng)的標(biāo)記名稱 if (oItem!=null) for (i=0。 i。 i++) alert((i).tagName)。 var oItem = (“Sample”)。 //得到 id為 Sample的所有元素并顯示出標(biāo)記名稱 If (oItem != null) for (i=0。 i。 i++) alert((i).tagName)。 要詳細(xì)介紹各個(gè)對象的使用超出了本書范圍。為方便讀者查閱，表 49列出了 DHTML常用對象名稱。 HTML DOM程序設(shè)計(jì)初步 文檔對象 (Document) HTML DOM程序設(shè)計(jì)初步 文檔對象 (Document) HTML DOM程序設(shè)計(jì)初步 文檔對象 (Document) 下面主要通過大量典型的實(shí)例幫助讀者掌握其編程方法 。 [例 ] 使用 documentElement將頁面源代碼調(diào)入編輯框；用滾動(dòng)鼠標(biāo)滾輪的方法放大或縮小圖片。 實(shí)現(xiàn)代碼： 運(yùn)行效果： [例 ] 使用 document對象查看元素名稱。 實(shí)現(xiàn)代碼： 運(yùn)行效果： [例 ] 使用 Form數(shù)組和 Form名稱使得兩個(gè) Form中的文本輸入內(nèi)容保持一致。 實(shí)現(xiàn)代碼： 運(yùn)行效果： [例 ] 文檔對象應(yīng)用舉例。 實(shí)現(xiàn)代碼： 運(yùn)行效果： 445（文檔對象應(yīng)用） .html HTML DOM程序設(shè)計(jì)初步 文檔對象 (Document) [例 ]設(shè)計(jì)一個(gè)輸入個(gè)人信息的頁面示例。 實(shí)現(xiàn)代碼： 運(yùn)行效果： [例 ] 逐條顯示信息的跑馬燈。 實(shí)現(xiàn)代碼： 運(yùn)行效果： [例 ]先出現(xiàn)文件上載對象 ，沒有提交按鈕，在檢查上傳圖片的大小后，若圖片符合要求則動(dòng)態(tài)創(chuàng)建一個(gè)提交按鈕。 實(shí)現(xiàn)代碼： 運(yùn)行效果： 448（圖片上載） .html [例 ]實(shí)現(xiàn)鼠標(biāo)懸停時(shí)，顯示放大的圖片。 實(shí)現(xiàn)代碼： 運(yùn)行效果： [例 ] 動(dòng)態(tài)生成一個(gè)表格 實(shí)現(xiàn)代碼： 運(yùn)行效果： HTML DOM程序設(shè)計(jì)初步 文檔對象 (Document) [例 ] 用鼠標(biāo)器滾輪放大和縮小圖形。 實(shí)現(xiàn)代碼： 運(yùn)行效果： [例 ] 播放 MP3等媒體文件。 實(shí)現(xiàn)代碼： ： HTML DOM程序設(shè)計(jì)初步 HTML DOM樹簡介 HTML DOM樹簡介 HTML DOM是一種結(jié)構(gòu)化的對象模型 ， 采用 DOM技術(shù)訪問和更新 HTML頁面內(nèi)容時(shí) ， 首先依據(jù) HTML源代碼 ， 建立頁面的樹形結(jié)構(gòu)模型 ， 然后按照樹形結(jié)構(gòu)的層次關(guān)系來操縱 Web頁面 。 圖 417所示為一個(gè) Web頁文件所對應(yīng)的 DOM節(jié)點(diǎn)樹 ， 又稱文檔大綱 。 在 DOM樹形結(jié)構(gòu)中 ， 每個(gè)節(jié)點(diǎn)都是一個(gè)對象 ， 各節(jié)點(diǎn)對象都有屬性和方法 。 DOM 有 兩 個(gè) 對 象 集 合 ： attributes 和 chileNodes 。attributes是節(jié)點(diǎn)屬性的對象集合 。 chileNodes是子節(jié)點(diǎn)的對象集合 ， 使用從 0開始的索引值進(jìn)行訪問 。 DOM樹形結(jié)構(gòu)節(jié)點(diǎn)有只讀屬性和讀寫屬性兩類 。 通過只讀屬性可以瀏覽節(jié)點(diǎn) ， 并可獲得節(jié)點(diǎn)的類型及名稱等信息；通過讀寫屬性可以訪問文字節(jié)點(diǎn)的內(nèi)容 。 DOM樹節(jié)點(diǎn)的屬性如表 。 HTML DOM程序設(shè)計(jì)初步 HTML DOM樹簡介 表 410 DOM樹節(jié)點(diǎn)的屬性 HTML DOM程序設(shè)計(jì)初步 HTML DOM樹簡介 圖 417 文檔大綱 HTML DOM程序設(shè)計(jì)初步 HTML DOM樹簡介 用 DOM方法可以創(chuàng)建 HTML文檔，并可以通過 JavaScript程序隨時(shí)改變文檔的節(jié)點(diǎn)結(jié)構(gòu)或內(nèi)容，建立動(dòng)態(tài)網(wǎng)頁效果。DOM樹的常用方法如表 411所示。 表 411 DOM樹的常用方法 HTML DOM程序設(shè)計(jì)初步 HTML DOM樹簡介 在用 createElement方法創(chuàng)建一個(gè)元素時(shí)，其中的參數(shù)可以使用表 412中所列 DHTML對象的名稱。對象名稱的含義和標(biāo)記名稱基本相同，具體說明可參閱相關(guān)資料。 HTML DOM程序設(shè)計(jì)初步 HTML DOM樹簡介 例如創(chuàng)建一個(gè)按鈕元素：(“input type=?button?”)； 創(chuàng)建一個(gè)超鏈接元素： (“A”)。 下面的示例代碼給出了 DOM樹的編程方法。 [例 ]請讀者體驗(yàn)以下 DOM樹編程過程。 單擊按鈕 button后的執(zhí)行結(jié)果如圖 419所示。 實(shí)現(xiàn)代碼： 運(yùn)行效果： DHTML綜合編程實(shí)踐 廣告條定時(shí)滾動(dòng) 功能描述：定時(shí)滾動(dòng)廣告條。共有 3個(gè)廣告條，每個(gè)廣告條中有六個(gè)超鏈接。頁面顯示 10秒鐘后才開始廣告滾動(dòng)。將鼠標(biāo)放到廣告條上就停止?jié)L動(dòng)，鼠標(biāo)離開廣告條就滾動(dòng)。 實(shí)現(xiàn)代碼： 定時(shí)滾動(dòng)廣告 .txt 運(yùn)行效果： 定時(shí)滾動(dòng)廣告 .html DHTML綜合編程實(shí)踐 通過 URL傳遞參數(shù) 功能描述： 有兩個(gè) HTML頁面文檔 , 分別是 ，要從 url地址傳送到 ，在。在 url地址中用問號(hào)后附帶參數(shù)的方法傳遞參數(shù)，每個(gè)參數(shù)之間用 amp。相隔。 例如： url=:amp。name=wcl“中分別傳遞了兩個(gè)參數(shù) 和 name，它們的值分別是 wcl。 實(shí)現(xiàn)代碼： 通過 URL傳遞參數(shù) 運(yùn)行效果： DHTML綜合編程實(shí)踐 超文本編輯器及其與 Word的互操作 功能描述：用 Iframe幀標(biāo)記實(shí)現(xiàn)文本編輯器和超文本編輯器功能，可以將編輯框中的內(nèi)容自動(dòng)放到 word中讓用戶編輯；可將用戶在 word中編