ASP.Net 中的三种控件

---恢复内容开始---

第一种:HTML控件

ASP.Net把HTML控件当成普通字符串渲染到浏览器端,不去检查正确性、无法在服务器端进行处理。

比如:

1 <input111 type="text" name="name" value=" " />
2 <input type="text" name="name" value=" " />

自己写的错误的HTML控件不会在浏览器显示,也不会报错。

1 //客户端:
2 <input type="text" name="name" value=" " id="text1"/>
3 -------------------------------------------------------4 //服务器端:
5 protected void Page_Load(object sender, EventArgs e)
6 {
7         text1.Text = "abc";  //报错,名称"text1"不存在
8 }

 

第二种:ASP.Net服务端控件

经过ASP.Net高度封装的控件,使用简单,运行在服务器端,可以在服务端使用C#代码进行操作,会渲染到客户端为HTML控件。

比如:

1 <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>

在浏览器端渲染为:

1 <input name="TextBox1" type="text" id="TextBox1" />

 

第三种:runat="server"的HTML控件。

在HTML控件的基础上添加 runat="server",也是运行在服务器端的,也可以服务器端使用C#代码进行操作,也会渲染到客户端,不像ASP.Net服务端控件那样高度封装,暴露的属性大部分是普通HTML属性。和ASP.Net服务端控件相比的好处是:当需要服务器端要对控件进行操作的时候,如果控件没有被ASP.Net服务端控件封装的时候,用runat="server"的HTML控件很方便,runat="server"的HTML控件也会对虚拟路径、id -> ClientID 进行处理,所以在使用虚拟路径、UserControl中也可能会用到。

比如:

 1 protected void Page_Load(object sender, EventArgs e)
 2 {
 3      //ASP.Net服务器端控件高度封装,设置样式
 4      TextBox1.BackColor = Color.Red;   //设置背景颜色
 5      TextBox1.BorderStyle = BorderStyle.Dotted; //设置边框
 6  
 7      //runat="server"的HTML控件没有封装,设置样式方式不统一
 8      //Text1为文本框id,td1为表格的单元格id
 9      Text1.Value = "aaa";  //设置文本框内的值
10      td1.Align = "center";
11      td1.BgColor = "red";
12      td1.Width = "50%";    
13 }
14 ------------------------------------------------------------
15 //Text1能按原始的方式设置样式
16 <input type="text" style="background-color:Green;border:dotted;" runat="server" id="Text1"/>   

 <a> -> HtmlAnchor;<form> -> HtmlForm;head -> HtmlHead;input -> HtmlInputButton、HtmlInputCheckBox、HtmlInputText等;meta -> HtmlMeta;table -> HtmlTable;tr -> HtmlTableRow;td -> HtmlTableCell;title -> HtmlTitle。未单独封装的标签(比如div)对应类型为HtmlGenericControl。使用Attributes属性操作未封装的属性。

 PS:在JS脚本中取第一种和第三种服务器端控件的ID方法:

document.getElementById("<%=Button1.ClientID %>");

document.getElementById("<%=TextBox1.ClientID %>");

posted on 2018-06-13 14:04  空空Ryan  阅读(3077)  评论(0编辑  收藏  举报

导航