项目 HTML服务器控件 Web服务器控件

是否映射到

HTML标签

与HTML标签存在一一对应的映射关系。runat=server属性把传统的HTML标签转换成服务器控件。这使得开发人员可以将ASP页面移植到ASP.NET平台上。 不直接映射到HTML标签,这使得可以开发人员可以使用第三方的控件

对象模型

使用HTML中心对象模型,在该模型中,控件包括一个关健字/值对的属性集合。 使用基于组件的对象模型,该模型要求使用一致对象类型。

是否能自适应输出

不能根据浏览器的不同,调整所输出HTML文档的显示效果 可以自动根据浏览器的不同,调整所输出HTML文档的显示效果

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" οnclick="return DeleteCheck(this)" id="Button1" value="Client button" />
<input runat="server" type="submit" οnclick="return DeleteCheck(this)" id="Button2" value="Server submit" />
<input type="submit" οnclick="return DeleteCheck(this)" id="Button3" value="Client submit" />
<button runat="server" id="button4" οnclick="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" οnclick="return DeleteCheck(this)" id="Button1" value="Client button" />
<input name="Data$ctl03$Button2" type="submit" id="Data_ctl03_Button2" οnclick="return DeleteCheck(this)" value="Server submit" / > 
<input ut type="submit" οnclick="return DeleteCheck(this)" id="Button3" value="Client submit" />
<button id="Data_ctl03_button4" οnclick="return DeleteCheck(this)" value="Button-Button">Button-Button</button>
<input type="submit" name="Data$ctl03$button5" value="Asp:button" οnclick="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" οnclick="return DeleteCheck(this)" id="Button1" value="Client button" />
<input runat="server" type="submit" οnclick="return DeleteCheck(this)" id="Button2" value="Server submit" />
<input type="submit" οnclick="return DeleteCheck(this)" id="Button3" value="Client submit" />
<button runat="server" id="button4" οnclick="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>

生成的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" οnclick="__doPostBack('delete','')" name="delete" type="button" id="delete" value="Server button" />
<input type="button" οnclick="return DeleteCheck(this)" id="Button1" value="Client button" />
<input name="Button2" type="submit" id="Button2" οnclick="return DeleteCheck(this)" value="Server submit" />
<input type="submit" οnclick="return DeleteCheck(this)" id="Button3" value="Client submit" />
<button id="button4" οnclick="return DeleteCheck(this)" value="Button-Button">Button-Button</button>
<input type="submit" name="button5" value="Asp:button" οnclick="return DeleteCheck(this);" id="button5" />
<a id="LinkButton1" href="javascript:__doPostBack('LinkButton1','')">LinkButton</a>

这里有可以看出几点:
    1、当html服务器控件在服务器端添加了服务器事件后生成的代码变为:οnclick="_doPostBack()",实际上是调用脚本把整个窗体提交到服务器(如果没有添件服务器事件而只是添加了runat="server"是不会发送到服务器端的)这里注意如果要在html服务器控件中添加一个客户端事件如上面的: 
<input runat="server" type="button" id="delete" value="Serverbutton"onserverclick="delete_ServerClick" />
变成 
<input runat="server" type="button" id="delete" value="Server button" οnclick="return DeleteCheck(this)" onserverclick="delete_ServerClick" />
那样生成的html代码变成 
<input language="javascript" οnclick="return DeleteCheck(this) __doPostBack('delete','')" name="delete" type="button" id="delete" value="Server button" />
提示有脚本错误原因是onclick事件执行了2个脚本且书写的格式不正确。
οnclick="return DeleteCheck(this);_doPostBack()"
这样的话就只能执行第一个函数而第二个函数就不能执行了(return).如果用
οnclick="return DeleteCheck(this),_doPostback()"
是指2个函数同时都要执行没有影响(相当于一条语句)。在我的一个项目中需要对于控件进行区分总结,我在网上找了找加上自己的实际测试总结如下:
这里有可以看出几点:
    1、当html服务器控件在服务器端添加了服务器事件后生成的代码变为:οnclick="_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" οnclick="return DeleteCheck(this)" onserverclick="delete_ServerClick" />
那样生成的html代码变成 
<input language="javascript" οnclick="return DeleteCheck(this) __doPostBack('delete','')" name="delete" type="button" id="delete" value="Server button" />
提示有脚本错误原因是onclick事件执行了2个脚本且书写的格式不正确。
οnclick="return DeleteCheck(this);_doPostBack()"这样的话就只能执行第一个函数而第二个函数就不能执行了(return).如果用οnclick="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我想是通过发送到服务器端执行的。

转载于:https://www.cnblogs.com/q994321263/p/4035062.html

HTML服务器控件与Web服务器控件的区别[转]相关推荐

  1. ASP.NET中共有哪几种类型的控件?其中,HTML控件、HTML服务器控件和WEB服务器控件之间有什么区别

    [考点] ASP.NET中的控件类型理解. [出现频率] ★★★☆☆ [解答] ASP.NET的控件包括WEB服务器控件.WEB用户控件.WEB自定义控件.HTML服务器控件和HTML控件.HTML控 ...

  2. [转]html控件、html服务器控件和web服务器控件的区别

    asp.net之所以现在开发方便和快捷,关键是它有一组强大的控件库,包括web服务器控件,web用户控件,web自定义控件,html服务器控件和html控件等.这里我主要说说html控件.html服务 ...

  3. html控件、html服务器控件和web服务器控件的区别

    [RT]html控件.html服务器控件和web服务器控件的区别 2009-07-13 下午 12:24 asp.net之所以现在开发方便和快捷,关键是它有一组强大的控件库,包括web服务器控件,we ...

  4. 如何显示服务器控件,Panel Web 服务器控件概述

    Panel Web 服务器控件概述 10/22/2014 本文内容 更新:2007 年 11 月 Panel Web 服务器控件在 ASP.NET 网页内提供了一种容器控件,您可以将它用作静态文本和其 ...

  5. Web服务器控件和HTML控件的区别与联系

    我们知道,在ASP.NET中,使用了两类控件,一类是HTML控件,还有一类是WEB控件. WEB控件我们已经很熟悉,因为它是ASP.NET提供,一般关于ASP.NET的教程文章都会仔细介绍这些控件的详 ...

  6. Asp.net控件之异同:HTML控件与Web服务器控件

    Asp.net之所以现在开发方便和快捷,关键是它有一组强大的控件库,包括web服务器控件,web用户控件,web自定义控件,html服务器控件和html控件等.这里我主要说说html控件.html服务 ...

  7. WEB——服务器控件

    目录 一.标准服务器控件 1.Label 2.TextBox 3.Button族 4.HyperLink 5.ListBox 6.DropDownList 7.ImageMap 8.Table 9.F ...

  8. Web服务器控件和HTML控件区别

     这两天在学习ASP.NET,遇到了Web服务器控件和HTML控件.刚开始看见这两个控件的时候,感觉很相似. 所以就想到了如下问题:这两个控件有什么区别?后来又看到了HTML服务器控件(加上run ...

  9. 风影ASP.NET基础教学 2 web服务器控件

    在asp.net中,web标准服务器控件是ASPNET的核心部件,也是Web Form编程模型的最基本元素.相对于Html服务器控件而言,它具有更多的内置功能和可编程性.它不仅包括简单的按钮和文本框这 ...

最新文章

  1. 项目管理流程有哪些?如何才能让项目管理更有效?
  2. 从城市治理到城市“智”理,AI 不仅是城市管理的“眼睛”
  3. 大型网站系统架构演化之路
  4. Aggregate累加器
  5. java拾遗录(一)
  6. 发票二维码扫描增强_03_图像预处理_01_图像切片
  7. class12_pack_grid_place 放置位置
  8. linux svn 面板,Linux下SVN服务器搭建(CentOS+Subversion)
  9. 尚硅谷面试第一季-21消息队列在项目中的应用
  10. Introducing DataFrames in Apache Spark for Large Scale Data Science(中英双语)
  11. apache poi教程_Apache POI教程
  12. 软件系统架构师大概工作过程
  13. PHP之tp3点击刷新验证码登录
  14. SaaSBase:什么是零一裂变SCRM?
  15. 百度冰桶算法2.0简介
  16. 《阳光下》 ——【传递正反馈】
  17. 全球与中国前置式翻斗车市场深度研究分析报告
  18. 华硕笔记本BIOS设置禁用UEFI后使用U盘装系统方法
  19. shoug oracle,SHOUG User Group Young Expert Program
  20. 如何应对面试中的手写算法

热门文章

  1. 部署RDS服务器实现密码修改功能
  2. python之if和while控制流
  3. Android中View绘制流程以及invalidate()等相关方法分析
  4. Eclipse 中maven插件坏死解决办法
  5. 内蒙十二地市的称谓对应关系
  6. 静态页转换平台(StaticPol)-静态页生成终极解决方案
  7. BCH钱包Electron Cash探索新的众筹模式
  8. 比特币现金扬声器系列II将领先的比特币一起带来
  9. mustache模板技术
  10. 交叉编译VIM并移植到ARM嵌入式Linux系统