asp.net之所以現在開發方便和快捷，關鍵是它有一組強大的控制元件庫，包括web伺服器控制元件,web使用者控制元件，web自定義控制元件，html伺服器控制元件和html控制元件等。這裡主要整理一下html控制元件、html伺服器控制元件和web伺服器控制元件

html控制元件

就是我們通常的說的html語言標記，這些語言標記在已往的靜態頁面和其他網頁裡存在,不能在伺服器端控制的，只能在客戶端通過javascript等程式語言來控制。

<span style="font-size:14px;"><input type="button" id="btn" value="button"/></span>
 

html伺服器控制元件

其實就是html控制元件的基礎上加上runat="server"所構成的控制元件。它們的主要區別是執行方式不同，html控制元件執行在客戶端，而html伺服器控制元件是執行在伺服器端的。 當ASP.NET網頁執行時，會檢查標籤有無runat屬性，如果標籤沒有設定，那麼Html標籤就會被視為字串，並被送到字串流等待送到客戶端，客戶端的瀏覽器會對其進行解釋；如果Html標籤有設定runat="server" 屬性，Page物件會將該控制元件放入控制器，伺服器端的程式碼就能對其進行控制，等到控制執行完畢後再將Html伺服器控制元件的執行結果轉換成Html標籤，然後當成字串流傳送到客戶端進行解釋 。

<span style="font-size:14px;"><input id="Button" type="button" value="button" runat="server" /></span>

web伺服器控制元件

也稱asp.net伺服器控制元件，是Web Form程式設計的基本元素，也是asp.net所特有的。它會按照client的情況產生一個或者多個html控制元件，而不是直接描述html元素。如： 

<span style="font-size:14px;"><asp:Button ID="Button2" runat="server" Text="Button"/></span>
 

是Html伺服器控制元件，此時我們點選此按鈕，頁面不會回傳到伺服器端，原因是我們沒有為其定義滑鼠點選事件。

我們為Html伺服器控制元件添加了一個onserverclick事件，點選此按鈕頁面會發回伺服器端，並執行服務端的test(object sender, EventArgs e)方法。

是Asp.net伺服器控制元件，並且我們沒有為其定義click，但是我們點選時，頁面也會發回到伺服器端。

    由此可見：Html標註和Html伺服器控制元件的事件是由頁面來觸發的，而Asp.net伺服器控制元件則是由頁面把Form發回到伺服器端，由伺服器來處理。

測試說明問題

<span style="font-size:14px;"><input runat="server" type="button" id="delete" value="Server button" />
<input type="button" onclick="return DeleteCheck(this)" id="Button1" value="Client button" />
<input runat="server" type="submit" onclick="return DeleteCheck(this)" id="Button2" value="Server submit" />
<input type="submit" onclick="return DeleteCheck(this)" id="Button3" value="Client submit" />
<button runat="server" id="button4" onclick="return DeleteCheck(this)" value="Button-Button">Button-Button</button>
<asp:Button runat="server" ID="button5" OnClientClick="return DeleteCheck(this)" Text="Asp:button" /></span>

<span style="font-size:14px;"><input name="Data$ctl03$delete" type="button" id="Data_ctl03_delete" value="Server button" />
<input type="button" onclick="return DeleteCheck(this)" id="Button1" value="Client button" />
<input name="Data$ctl03$Button2" type="submit" id="Data_ctl03_Button2" onclick="return DeleteCheck(this)" value="Server submit" / > 
<input type="submit" onclick="return DeleteCheck(this)" id="Button3" value="Client submit" />
<button id="Data_ctl03_button4" onclick="return DeleteCheck(this)" value="Button-Button">Button-Button</button>
<input type="submit" name="Data$ctl03$button5" value="Asp:button" onclick="return DeleteCheck(this);" id="Data_ctl03_button5" /></span></span>

<span style="font-size:14px;"><input runat="server" type="button" id="delete" value="Server button" onserverclick="delete_ServerClick" />
<input type="button" onclick="return DeleteCheck(this)" id="Button1" value="Client button" />
<input runat="server" type="submit" onclick="return DeleteCheck(this)" id="Button2" value="Server submit" />
<input type="submit" onclick="return DeleteCheck(this)" id="Button3" value="Client submit" />
<button runat="server" id="button4" onclick="return DeleteCheck(this)" value="Button-Button">Button-Button</button>
<asp:Button runat="server" ID="button5" OnClientClick="return DeleteCheck(this)" Text="Asp:button" OnClick="button5_Click" />
<asp:LinkButton ID="LinkButton1" runat="server" OnClick="LinkButton1_Click">LinkButton</asp:LinkButton></span>

<span style="font-size:14px;"><span style="font-size:14px;"><script type="text/javascript">
    <!--
        var theForm = document.forms['form1'];
        if (!theForm) {
            theForm = document.form1;
        }
        function __doPostBack(eventTarget, eventArgument) {
        i    f (!theForm.onsubmit 　　 (theForm.onsubmit() != false)) {
                theForm.__EVENTTARGET.value = eventTarget;
                theForm.__EVENTARGUMENT.value = eventArgument;
                theForm.submit();
            }
        }
    // -->
    </script>
<input language="javascript" onclick="__doPostBack('delete','')" name="delete" type="button" id="delete" value="Server button" />
<input type="button" onclick="return DeleteCheck(this)" id="Button1" value="Client button" />
<input name="Button2" type="submit" id="Button2" onclick="return DeleteCheck(this)" value="Server submit" />
<input type="submit" onclick="return DeleteCheck(this)" id="Button3" value="Client submit" />
<button id="button4" onclick="return DeleteCheck(this)" value="Button-Button">Button-Button</button>
<input type="submit" name="button5" value="Asp:button" onclick="return DeleteCheck(this);" id="button5" />
<a id="LinkButton1" href="javascript:__doPostBack('LinkButton1','')">LinkButton</a></span></span>

這裡注意如果要在html伺服器控制元件中新增一個客戶端事件如上面的: 
<input runat="server" type="button" id="delete" value="Serverbutton"onserverclick="delete_ServerClick" />
變成 
<input runat="server" type="button" id="delete" value="Server button" onclick="return DeleteCheck(this)" onserverclick="delete_ServerClick" />
那樣生成的html程式碼變成 
<input language="javascript" onclick="return DeleteCheck(this) __doPostBack('delete','')" name="delete" type="button" id="delete" value="Server button" />
提示有指令碼錯誤：原因是onclick事件執行了2個指令碼且書寫的格式不正確。
onclick="return DeleteCheck(this)；_doPostBack()"這樣的話就只能執行第一個函式而第二個函式就不能執行了(return).

如果用onclick="return DeleteCheck(this)，_doPostback()"是指2個函式同時都要執行沒有影響(相當於一條語句)。

使用場景

如果需要對控制元件進行動態的處理，或要儲存其狀態等可以選擇WEB伺服器控制元件！

WEB伺服器控制元件用起來個人認為要方便,但考慮效能的話在能不用WEB伺服器控制元件的地方就儘量不用