1. 程式人生 > >html控制元件、html伺服器控制元件和web伺服器控制元件的區別

html控制元件、html伺服器控制元件和web伺服器控制元件的區別

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

、html伺服器控制元件和web伺服器控制元件的區別。

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

語言來控制。
如:<input type="button" id="btn" value="button"/>

    2、html伺服器控制元件:其實就是html控制元件的基礎上加上runat="server"所構成的控制元件.它們的注意區別是執行方式不同,html控制元件執行在客戶端,而html伺服器控制元件是執行在服務

器端的。參考其他資料是這樣說的: 當ASP.NET 網頁執行時,會檢查標註有無runat 屬性,如果標註沒有設定,那麼Html標註就會被視為符串,並被送到字串流等待送到客戶端

,客戶端的瀏覽器會對其進行解釋;如果Html標註有設定runat="server" 屬性,Page 物件會將該控制元件放入控制器,伺服器端的程式碼就能對其進行控制,等到控制執行完畢後再將

Html伺服器控制元件的執行結果轉換成Html標註,然後當成字串流傳送到客戶端進行解釋。
如: <input id="Button" type="button" value="button" runat="server" />

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

素。
如: <asp:Button ID="Button2" runat="server" Text="Button"/>
那麼它和html伺服器控制元件有什麼區別呢?參照其他網頁的資料看法如下:
    1)、Asp.net伺服器控制元件提供更加統一的程式設計介面,如每個Asp.net伺服器控制元件都有Text屬性。
    2)、隱藏客戶端的不同,這樣程式設計師可以把更多的精力放在業務上,而不用去考慮客戶端的瀏覽器是ie還是firefox,或者是移動裝置。
    3)、Asp.net伺服器控制元件可以儲存狀態到ViewState裡,這樣頁面在從客戶端回傳到伺服器端或者從伺服器端下載到客戶端的過程中都可以儲存。
    4)、事件處理模型不同,Html標註和Html伺服器控制元件的事件處理都是在客戶端的頁面上,而Asp.net伺服器控制元件則是在伺服器上,舉例來說:
    <input id="Button4" type="button" value="button" runat="server"/>是Html伺服器控制元件,此時我們點選此按鈕,頁面不會回傳到伺服器端,原因是我們沒有為其定義滑鼠

點選事件。
    <input id="Button4" type="button" value="button" runat="server" onserverclick
="test" />我們為Html伺服器控制元件添加了一個onserverclick事件,點選此按鈕頁面會

發回伺服器端,並執行test(object sender, EventArgs e)方法。
    <asp:Button ID="Button2" runat="server" Text="Button" />是Asp.net伺服器控制元件,並且我們沒有為其定義click,但是我們點選時,頁面也會發回到伺服器端。
    由此可見:Html標註和Html伺服器控制元件的事件是由頁面來觸發的,而Asp.net伺服器控制元件則是由頁面把Form發回到伺服器端,由伺服器來處理。

    4、下面我就結合我自己的測試來說明問題:
    這段程式碼是我放在repeat中的模板裡的:其中DeleteCheck是一個js指令碼函式,注意是用於是否傳送到伺服器端的,這裡就不展示指令碼程式碼了。
    <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" />

    展現出來的html程式碼如下:
    <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 ut 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" />
可以看出以下幾點:
    1、當控制元件屬性中有runat="server"時,生成的html控制元件時name和id發生的變化(.net Framework)。
    2、當asp:button伺服器按鈕通過生成的頁面後轉化成型別為submit型別的Client控制元件。
    3、當控制元件是html控制元件時通過生成的頁面和原來的html程式碼完全一樣(理由上面已經說名)。

    另外我還測試了把這段程式碼直接放到form標記中(不放到其他子標記中)如:
    <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>

   直接放到form 標記中生成的html程式碼
    <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>

     這裡有可以看出幾點:
     1、當html伺服器控制元件在伺服器端添加了伺服器事件後生成的程式碼變為:onclick="_doPostBack()",實際上是呼叫指令碼把整個窗體提交到伺服器(如果沒有添件伺服器事件而只

是添加了runat="server"是不會發送到伺服器端的)。這裡注意如果要在html伺服器控制元件中新增一個客戶端事件如上面的

   <input runat="server" type="button" id="delete" value="Server button" 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個函式同時都要執行沒有影響(相當於一條語句)。
2、asp:button中的onclientclick事件生成後就變成了onclick事件了,型別變成了type="submit".然而伺服器事件的onclick我想是通過傳送到伺服器端執行的。

    3、LinkButton不定義onclick事件,它會自動的生成下面程式碼傳送到伺服器端。 href="javascript:__doPostBack('LinkButton1',' ')"

    4、asp:button中的onclientclick事件生成後就變成了onclick事件了,型別變成了type="submit".然而伺服器事件的onclick我想是通過傳送到伺服器端執行的。

相關推薦

html控制元件html伺服器控制元件web伺服器控制元件區別

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

ASP.NET中共有哪幾種類型的控件?其中,HTML控件HTML服務器控件WEB服務器控件之間有什麽區別

web服務 編程 用戶 控制 什麽 lin bsp 兼容性 check ASP.NET的控件包括WEB服務器控件、WEB用戶控件、WEB自定義控件、HTML服務器控件和HTML控件。HTML控件、HTML服務器控件和WEB服務器控件之間的區別如下所示。q HTML

MVC部分視圖的使用(Html.Partial/RenderPartialHtml.Action/RenderActionRenderPage)

razor語法 一次 span tle viewdata 多重 mls 字符 抓取 ASP.NET MVC 裏頁面往往會有許多重用的地方,可以進行封裝重用。 使用部分視圖有以下優點: 1. 可以簡寫代碼。 2. 頁面代碼更加清晰、更好維護。 在視圖裏有多種方法可以 加載部分

1.Htmlhtml是什麼html文件結構

borde image 文件的 意思 color png 趨勢 編碼 其他 相關內容: html是什麼 html文件結構 html是什麽: hmtl超文本標記語言,標準通用標記語言下的一個應用。 html專門用於網頁,它的“標誌符”告訴了瀏覽器如何顯示其中的

獨享版虛擬主機共享版虛擬主機伺服器ECS的區別?

虛擬主機:虛擬主機即通過相關技術把一臺伺服器劃分成多個一定大小的硬碟空間,每個空間都給予單獨的FTP許可權和Web訪問許可權,多個使用者共同平均使用這臺伺服器的硬體資源。市場上的虛擬主機都是共享版虛機的模式。 獨享版虛擬主機:與共享版虛擬主機相比,最大的不同是資源獨享,享有

1. OneNet 平臺Web伺服器對接

接通NB模組,電源、串列埠 1.onenet新增裝置 IMEI號--模組ID和IMSI --SIM卡ID 新增裝置, 2.串列埠除錯助手  安裝Ugreen驅動和sscom.exe串列埠除錯   串列埠除錯助手傳送資料 傳送資料後,可以從one

應用程式伺服器Web伺服器區別

原文地址:http://www.javaworld.com/article/2077354/learn-java/app-server-web-server-what-s-the-difference.html 什麼是應用伺服器和Web伺服器之間的區別? Web伺服器專門處理HTTP

萬樹IT:淺談ASP.NETWeb伺服器

如何使用Silverlight 2的Beta1版本建造一個簡單的Digg客戶端應用。教程旨在按順序閱讀,幫著解釋Silverlight的一些核心程式設計概念。 使用 VS 2008 建立一個新的Silverlight 應用我們來開始我們的Digg應用的開發,先選擇Visual Studio 20

動態語言靜態語言強型別定義語言弱型別定義語言區別

呵~~(冷笑) 第一次接觸pythod,是一個朋友告知我它是一種弱型別語言,不用規定變數型別,於是”python=弱型別“ 的概念在我腦海紮根,並且深信不疑!! 然後每每和別人談起pythod時,我就會以資深口吻”哦,pythod啊,它是一種弱型別語言“開頭~~

使用nginx伺服器搭建ftp圖片伺服器需要注意的地方

1、在nginx./configuration   的安裝路徑如 /usr/local/nginx   目錄下,會產生一個conf資料夾,這個conf和解壓之後安裝包下面的那個conf是倆個不同的資料夾,我遇到過這個坑,一直改的是安裝包下面的那個,改錯了 2、啟動關閉命令

mysql筆記三-----sql儲存過程事務的隔離級別sql各查詢的區別防黑

儲存過程 ※※儲存過程※※※ 定義: create procedure 過程名(引數) begin 多條sql語句 end 呼叫: call 過程名(實參) 例項1--無參的儲存過程: △小細節:要把預設的語句結束“;”號改成其它如“$$”,

ApacheTomcat的區別Web伺服器,容器應用伺服器區別問題

清理書籤的時候發現了遺留的Apache和Tomcat的區別的問題。打算把剛開始學習Servlet的時候的問題一同解決了,剛開始學習J2EE的時候,先學習的是Servlet,執行需要Tomcat,當時我

什麼是WEB伺服器? 常用的WEB伺服器有哪些?

一、什麼是WEB伺服器     Web伺服器可以解析HTTP協議。當Web伺服器接收到一個HTTP請求,會返回一個HTTP響應,例如送回一個HTML頁面。為了處理一個請求Web伺服器可以響應一個靜態頁面或圖片,進行頁面跳轉或者把動態響應的產生委託給一些其它的程式例如CGI指

淺析資料庫(DB)操作資料儲存(ODS)資料倉庫(DW)的區別與聯絡

文章背景: 相信大部分剛接觸上面三個概念的同學,都多多少少會有些迷惑,現在我就給大家簡單分析下這三者的關係,希望大家對這三者的概念理解有所幫助吧。 本文主要從下面兩類關係來敘述上面三者的關係: 資料庫(DB)和資料倉庫(DW)的區別與聯絡操作資料儲存(ODS)和資料倉庫(DW)的區別與聯絡 資料庫與資

原子操作訊號量讀寫訊號量自旋鎖的區別與聯絡

一.為什麼核心需要同步方法 併發指的是多個執行單元同時,並行被執行,而併發的執行單元對共享資源(硬體資源和軟體上的全域性變數,靜態變數等)的訪問則很容易導致競態。 主要競態發生如下: 1.對稱多處理器(SMP)多個CPU  SMP是一種緊耦合,共享儲存的系統模型,它的特點是多個CPU使用共同的系統匯流排,因此

j2ee應用伺服器web伺服器

Tomcat伺服器是一個免費的開放原始碼的Web應用伺服器。因為Tomcat技術先進、效能穩定且免費,所以深受Java愛好者的喜愛並得到了部分軟體開發商的認可,成為目前比較流行的Web應用伺服器。 一、Tomcat與應用伺服器 到目前為止,Tomcat一直被認為是S

本機ip127.0.0.10.0.0.0區別

IP地址的記法: IP地址由四個位元組構成,為了方便閱讀和書寫,每個位元組用0-255的數字表示,位元組之間用’.’分割,如:10.10.152.235 有時候我們會看到這樣的IP:10.10.152.235/24,後面的/24表示子網掩碼,24表示子網

實戰WEB 伺服器(JAVA編寫WEB伺服器

  一、超文字傳輸協議     1.1 HTTP請求     1.2 HTTP應答   二、Socket類   三、ServerSocket類   四、Web伺服器例項     4.1 HttpServer類     4.2 Request類     4.3 Response

自建本地伺服器,自建Web伺服器——保姆級教程!

# 搭建本地伺服器,Web伺服器——保姆級教程! **本文首發於[https://blog.chens.life/How-to-build-your-own-server.html](https://blog.chens.life/How-to-build-your-own-server.html)。**

微信小程式裡面的標籤html標籤的對比微信小程式基礎之常用控制元件

微信小程式和html5標籤的區別: HTML5 微信小程式 <h1></h1>...<h6></h6> <p>&l