·金屬世界博覽展組委會

·FZLbxg

·噪聲治理

·云A鋼兆鋼材

·sdadwqwe

·大明看盤的 Blog

·鋼市采風(fēng)

·啦啦風(fēng)鷂的博客

·金鱗

·綠幻藍(lán)想

·歡樂調(diào)頻

·I虎氣沖天

熱門文章TOP10

更多

　　在微軟IE 5.0版本的瀏覽器發(fā)布以前，網(wǎng)頁編程中面對的最大挑戰(zhàn)就是不能輕易地創(chuàng)建組件，以達(dá)到代碼重用和多頁面共享的目的。這個(gè)問題一直困擾著DHTML（動態(tài) HEML）的網(wǎng)頁編程者。他們只能不斷地重復(fù)書寫HTML、CSS和javascript的代碼，以滿足多個(gè)頁面上的重復(fù)或相似的功能。自IE 5.0瀏覽器發(fā)布后，這種情況得到了改善，它帶給我們一個(gè)新的指令組合方法，可把實(shí)現(xiàn)特定功能的代碼封裝在一個(gè)組件內(nèi)，從而實(shí)現(xiàn)多頁面的代碼重用，使網(wǎng)頁編程進(jìn)入一個(gè)全新的天地。這個(gè)新的技術(shù)就是我們要談到的DHTML中的“行為”（Behaviors）。 　　“行為”作為一個(gè)簡單易用的組件，它封裝了頁面上特定的功能或動作。當(dāng)把一個(gè)“行為”附到WEB頁面中的一個(gè)元件上時(shí)，這個(gè)元件的原有行為就會有所改變。因此，網(wǎng)頁編程者可以開發(fā)通用的DHTML指令，并改變原有對象的一些屬性，用“行為”來增強(qiáng)一個(gè)對象的功能，同時(shí)也簡化了頁面的HTML代碼。而且“行為”的創(chuàng)建和使用也非常簡單方便，所需的知識也只是原來已經(jīng)習(xí)慣使用的CSS樣式表、HTML指令和javascript腳本語言。只要你對此有所了解，有過實(shí)際編程的經(jīng)歷，學(xué)習(xí)并掌握“行為”的使用完全沒有問題。我們將以一個(gè)改變字體效果的“行為”組件為例來說明如何編寫和使用一個(gè)“行為”，并體驗(yàn)“行為”給頁面編輯帶來的優(yōu)點(diǎn)和方便之處。 　　首先新建一個(gè)名為font_efftce.htc的文本文件，組成“行為”組件的文件都是以.htc為擴(kuò)展名，這個(gè)文件中的內(nèi)容就是我們對這個(gè)“行為”的描述。它的創(chuàng)建和使用步驟如下： 　　(1) 首先給這個(gè)“行為”增加幾個(gè)事件響應(yīng)，語句書寫格式如下： “EVENT”對應(yīng)所需事件名,在這里分別為 : onmouseover,onmouseout,onmousedown,onmouseup四個(gè)事件名，你當(dāng)然可以再增加其它的事件名來滿足你的特定需求。“ONEVENT”對應(yīng)著個(gè)自的事件句柄，即事件觸發(fā)時(shí)所調(diào)用的函數(shù)名稱。glowit()函數(shù)使字體周圍產(chǎn)生一個(gè)紅色的輝光。noglow()函數(shù)是消除字體的輝光效果。Font2yellow()函數(shù)是把字體顏色改為黃色。Font2blue()函數(shù)是把字體顏色改為藍(lán)色。四個(gè)事件的定義都是相似的。 　　(2) 接下來，再給這個(gè)“行為”增加二個(gè)“方法”定義，內(nèi)容如下： 　　“NAME”參數(shù)對應(yīng)的是給定的“方法”名稱。move_down和move_right分別是向下和向右移動的“方法”對應(yīng)的函數(shù)名稱。注意，在方法名的后面不要帶“( )”括號，即不要寫成“move_down()”這個(gè)樣子，這在“方法”定義的語法上是不允許的。 　　(3) 接下來的工作就是在我們熟悉的DHTML環(huán)境下，用javascript腳本語句編寫“事件句柄”和“方法”所對應(yīng)的函數(shù)內(nèi)容，實(shí)現(xiàn)預(yù)期的效果。具體內(nèi)容參考下面的源程序。其中的“element”參數(shù)指的是這個(gè)“行為”所附著的對象，因?yàn)椤靶袨椤笨偸潜桓街�到頁面的元件上面，并通過這個(gè)元件發(fā)揮作用。其它語句都是DHTML的編程內(nèi)容，就不再多說了。如有不明之處，可參考微軟的MSDN開發(fā)文檔中有關(guān)IE瀏覽器的內(nèi)容，上面有詳細(xì)的DHTML編程參考內(nèi)容、屬性和方法使用說明等，并包含了大量的文章和舉例程序。經(jīng)常訪問微軟的MSDN文檔，尤其對于初學(xué)者來說是一個(gè)良好的學(xué)習(xí)習(xí)慣，你幾乎可以得到任何你想找的答案，它的網(wǎng)址為：http : //msdn.microsoft.com/ie/。 　　完整的“行為”文檔“font_effect.htc”的內(nèi)容如下： ////////////////////////“行為”文檔開始//////////////////////////// //給“行為”增加四個(gè)鼠標(biāo)事件 //給“行為”定義二個(gè)方法 //////////////////“行為”文檔結(jié)束/////////////////////////////// 　　(4) 如何在一個(gè)頁面上使用“行為” 　　在頁面上使用“行為”組件，并不需要學(xué)習(xí)新的知識。所需的知識的也不過是CSS樣式表和HTML的設(shè)置而已，請看下面的語句： 　　可以看出，這和以前我們已經(jīng)熟知的樣式表設(shè)置完全相同。上面的語句定義了一個(gè)樣式名：“myfilter”，其中對我們來說比較新的內(nèi)容是：“behavior : url(font_effect.htc);”，“behavior”是新增的“行為”屬性名，這就是“行為”在樣式表中的設(shè)置方式。括號中的內(nèi)容是“行為”文檔的文件名，本例中表明“行為”文檔在與頁面文件在同一個(gè)目錄下，如果“行為”文檔安置在其它目錄下，在此參數(shù)的前面要加上相應(yīng)的路徑名，以保證可以正確地定位“行為”文檔的位置。此“樣式”中的其它內(nèi)容就是普通的樣式屬性設(shè)置，可根據(jù)你的需要增減，但在此例中，由于使用了“glow”濾鏡效果，至少要設(shè)置一個(gè)寬度（width）屬性。通過以上的樣式指定，我們就有了一個(gè)名為：“myfilter”的樣式，它附帶一個(gè)有字體變化效果的“行為”。如果你想要在一個(gè)頁面元件上使用這個(gè)附帶“行為”的樣式，同樣也很簡單，只要把這個(gè)“樣式名”安置在元件的屬性設(shè)置區(qū)域即可，見下面的語句： 行為產(chǎn)生的文字效果
鼠標(biāo)指向后產(chǎn)生輝光 　　以上語句里面沒有什么新的內(nèi)容，class='myfilter'就是我們所熟悉的樣式設(shè)置。在第一個(gè)“span”標(biāo)記的屬性中還定義了一個(gè)“id”標(biāo)記，稍后就會看到，這是用來演示調(diào)用“行為”內(nèi)的“方法”而設(shè)置的。這樣設(shè)置后，“span”元件中的內(nèi)容就可以顯示出“行為”組件內(nèi)的預(yù)定效果： 　　1．鼠標(biāo)指針移動到文字內(nèi)容上時(shí)，在文字周圍產(chǎn)生紅色的輝光效果，同時(shí)文字變成白色。 　　2．當(dāng)鼠標(biāo)按鈕按下時(shí)，文字顏色改變?yōu)辄S色。 　　3．鼠標(biāo)按鈕抬起后，文字顏色又改變?yōu)樗{(lán)色。 　　4．當(dāng)鼠標(biāo)指針移動到文字區(qū)域以外時(shí)，去掉了紅色輝光效果，文字恢復(fù)原樣。 　　另外，我們在定義“行為”時(shí)設(shè)置了二個(gè)“方法”，“move_down”和“move_right”。為調(diào)用這二個(gè)“方法”，定義了二個(gè)按鈕： 向右移動第一行文字
向下移動第一行文字 　　用按鈕的onclick事件去調(diào)用這二個(gè)“方法”，先前定義的“id”標(biāo)記就作為元件的對象名稱，用“myspan.move_down”來調(diào)用“方法”，操縱這個(gè)對象。可以看到，在按下相應(yīng)的按鈕后，會使第一行的文字產(chǎn)生向下或向右的移動。雖然只是用第一行文字做了示范，實(shí)際上，只要做相應(yīng)的設(shè)置，你也可以移動其它對象。頁面源文檔的完整內(nèi)內(nèi)容如下：