“行為”作為壹個簡單易用的組件，它封裝了頁面上特定的功能或動作。當把壹個“行為”附到WEB頁面中的壹個元件上時，這個元件的原有行為就會有所改變。因此，網頁編程者可以開發通用的DHTML指令，並改變原有對象的壹些屬性，用“行為”來增強壹個對象的功能，同時也簡化了頁面的HTML代碼。而且“行為”的創建和使用也非常簡單方便，所需的知識也只是原來已經習慣使用的CSS樣式表、HTML指令和javascript腳本語言。只要妳對此有所了解，有過實際編程的經歷，學習並掌握“行為”的使用完全沒有問題。我們將以壹個改變字體效果的“行為”組件為例來說明如何編寫和使用壹個“行為”，並體驗“行為”給頁面編輯帶來的優點和方便之處。
首先新建壹個名為font_efftce.htc的文本文件，組成“行為”組件的文件都是以.htc為擴展名，這個文件中的內容就是我們對這個“行為”的描述。它的創建和使用步驟如下：
(1)首先給這個“行為”增加幾個事件響應，語句書寫格式如下：
<PUBLIC:ATTACH EVENT="onmouseover" ONEVENT="glowit()"/>
<PUBLIC:ATTACH EVENT="onmouseout" ONEVENT="noglow()"/>
<PUBLIC:ATTACH EVENT="onmousedown" ONEVENT="font2yellow()"/>
<PUBLIC:ATTACH EVENT="onmouseup" ONEVENT="font2blue()"/>
“EVENT”對應所需事件名,在這裏分別為:onmouseover,onmouseout,onmousedown,onmouseup四個事件名，妳當然可以再增加其它的事件名來滿足妳的特定需求。“ONEVENT”對應著個自的事件句柄，即事件觸發時所調用的函數名稱。glowit()函數使字體周圍產生壹個紅色的輝光。noglow()函數是消除字體的輝光效果。Font2yellow()函數是把字體顏色改為黃色。Font2blue()函數是把字體顏色改為藍色。四個事件的定義都是相似的。
(2)接下來，再給這個“行為”增加二個“方法”定義，內容如下。
<PUBLIC:METHOD NAME="move_down"/>
<PUBLIC:METHOD NAME="move_right"/>
“NAME”參數對應的是給定的“方法”名稱。move_down和move_right分別是向下和向右移動的“方法”對應的函數名稱。註意，在方法名的後面不要帶“( )”括號，即不要寫成“move_down()”這個樣子，這在“方法”定義的語法上是不允許的。
(3）接下來的工作就是在我們熟悉的DHTML環境下，用javascript腳本語句編寫“事件句柄”和“方法”所對應的函數內容，實現預期的效果。具體內容參考下面的源程序。其中的“element”參數指的是這個“行為”所附著的對象，因為“行為”總是被附著到頁面的元件上面，並通過這個元件發揮作用。其它語句都是DHTML的編程內容，就不再多說了。如有不明之處，可參考微軟的MSDN開發文檔中有關IE瀏覽器的內容，上面有詳細的DHTML編程參考內容、屬性和方法使用說明等，並包含了大量的文章和舉例程序。經常訪問微軟的MSDN文檔，尤其對於初學者來說是壹個良好的學習習慣，妳幾乎可以得到任何妳想找的答案，它的網址為：/ie/。
完整的“行為”文檔“font_effect.htc”的內容如下：
////////////////////////“行為”文檔開始////////////////////////////
//給“行為”增加四個鼠標事件
<PUBLIC:ATTACH EVENT="onmouseover" ONEVENT="glowit()"/>
<PUBLIC:ATTACH EVENT="onmouseout" ONEVENT="noglow()"/>
<PUBLIC:ATTACH EVENT="onmousedown" ONEVENT="font2yellow()"/>
<PUBLIC:ATTACH EVENT="onmouseup" ONEVENT="font2blue()"/>
//給“行為”定義二個方法
<PUBLIC:METHOD NAME="move_down"/>
<PUBLIC:METHOD NAME="move_right"/>
<SCRIPT LANGUAGE="JScript">
//定義壹個保存字體顏色的變量
var font_color;
//定義向下移動文字的方法
function move_down()
{
element.style.posTop+=2;
}
//定義向右移動文字的方法
function move_right()
{
element.style.posLeft +=6;
}
//定義鼠標onmouseup事件的調用函數
function font2blue(){
if (event.srcElement == element)
{
element.style.color='blue';
}
}
//定義鼠標onmousedown事件的調用函數
function font2yellow(){
if (event.srcElement == element)
{
element.style.color='yellow';
}
}
//定義鼠標onmouseover事件的調用函數
function glowit()
{
if (event.srcElement == element)
{
font_color=style.color;
element.style.color='white';
element.style.filter="glow(color=red,strength=2)";
}
}
//定義鼠標onmouseout事件的調用函數
function noglow()
{
if (event.srcElement == element)
{
element.style.filter="";
element.style.color=font_color;
}
}
</SCRIPT>
//////////////////“行為”文檔結束///////////////////////////////
(4)如何在壹個頁面上使用“行為”
在頁面上使用“行為”組件，並不需要學習新的知識。所需的知識的也不過是CSS樣式表和HTML的設置而已，請看下面的語句。
<STYLE>
.myfilter{behavior:url(font_effect.htc);position:relative;font-weight:bold;width=180;left:0;}
</STYLE>
可以看出，這和以前我們已經熟知的樣式表設置完全相同。上面的語句定義了壹個樣式名：“myfilter”，其中對我們來說比較新的內容是：“behavior:url(font_effect.htc);”，“behavior”是新增的“行為”屬性名，這就是“行為”在樣式表中的設置方式。括號中的內容是“行為”文檔的文件名，本例中表明“行為”文檔在與頁面文件在同壹個目錄下，如果“行為”文檔安置在其它目錄下，在此參數的前面要加上相應的路徑名，以保證可以正確地定位“行為”文檔的位置。此“樣式”中的其它內容就是普通的樣式屬性設置，可根據妳的需要增減，但在此例中，由於使用了“glow”濾鏡效果，至少要設置壹個寬度（width）屬性。通過以上的樣式指定，我們就有了壹個名為：“myfilter”的樣式，它附帶壹個有字體變化效果的“行為”。如果妳想要在壹個頁面元件上使用這個附帶“行為”的樣式，同樣也很簡單，只要把這個“樣式名”安置在元件的屬性設置區域即可，見下面的語句。
<span id="myspan" class='myfilter'>行為產生的文字效果</span><br>
<span class='myfilter'>鼠標指向後產生輝光</span>
以上語句裏面沒有什麽新的內容，class='myfilter'就是我們所熟悉的樣式設置。在第壹個“span”標記的屬性中還定義了壹個“id”標記，稍後就會看到，這是用來演示調用“行為”內的“方法”而設置的。這樣設置後，“span”元件中的內容就可以顯示出“行為”組件內的預定效果：
1． 鼠標指針移動到文字內容上時，在文字周圍產生紅色的輝光效果，同時文字變成白色。
2． 當鼠標按鈕按下時，文字顏色改變為黃色。
3． 鼠標按鈕擡起後，文字顏色又改變為藍色。
4． 當鼠標指針移動到文字區域以外時，去掉了紅色輝光效果，文字恢復原樣。
另外，我們在定義“行為”時設置了二個“方法”，“move_down”和“move_right”。為調用這二個“方法”，定義了二個按鈕：
<button onclick="myspan.move_right();">向右移動第壹行文字</button>
<br>
<button onclick="myspan.move_down();">向下移動第壹行文字</button>
用按鈕的onclick事件去調用這二個“方法”，先前定義的“id”標記就作為元件的對象名稱，用“myspan.move_down”來調用“方法”，操縱這個對象。可以看到，在按下相應的按鈕後，會使第壹行的文字產生向下或向右的移動。雖然只是用第壹行文字做了示範，實際上，只要做相應的設置，妳也可以移動其它對象。頁面源文檔的完整內內容如下：
<html >
<HEAD >
<TITLE >行為效果演示< /TITLE >
<STYLE >
.myfilter{behavior:url(font_effect.htc);position:relative;font-weight:bold;width=180;left:0;}
</STYLE>
</HEAD>
<BODY>
<span id="myspan" class='myfilter'>行為產生的文字效果</span><br>
<span class='myfilter'>鼠標指向後產生輝光</span><br>
<span class='myfilter'>同時文字變白</span><br>
<span class='myfilter'>按下鼠標後文字變黃</span><br>
<span class='myfilter'>擡起鼠標後文字變藍</span><br>
<span class='myfilter'>鼠標離開後文字恢復原狀</span><br>
<button onclick="myspan.move_right();">向右移動第壹行文字</button><br>
<button onclick="myspan.move_down();">向下移動第壹行文字</button>
</BODY>
</html>
通過以上的簡單介紹，可以看出，我們很容易地在壹個“行為”中同時組合了多種文字變化效果，通過簡單的“樣式”設置，任意地將它與頁面元件相關連，體現了“行為”組件的優點和強大功能。壹個“行為”組件，不僅能在壹個頁面內重復使用，也可供同壹站點上的所有頁面使用。試想壹下，如果不使用“行為”來完成上述的效果，雖然可以在頁面內調用壹組預定的函數來完成同樣的功能，但頁面內每壹個使用文字效果的元件都要附加四個鼠標事件，如果在多個頁面內使用相同的效果，被調用的函數也需要在每壹個頁面內重復設置。相比之下，孰優孰劣是很明顯的。所以，使用“行為”組件，可以制作出簡潔、高效、通用和便於維護的頁面。本文的舉例只是為了說明“行為”組件的編寫和使用過程，使讀者對“行為”編程有壹個概括的了解，並以此基礎制作出自己所需要的“行為”組件，或直接引用滿足個人需要的現成“行為”組件，因為“組件***享”的概念也是“行為”開發者的初衷。最後，願本文能起到“拋磚引玉”的目的，使讀者步入精彩的DHTML網頁編程天地。
(以上內容僅供參考!!!)