控制項呈現是將 HTML 標記、腳本、CSS 樣式寫入 HTTP 輸出串流,經由瀏覽器轉換為可視化元素的過程。ASP.NET 2.0 提供兩種主要呈現方式:Control.Render(基底類別)與 WebControl.RenderContents(Web 控制項專用)。本文聚焦 Control.Render 與核心輔助類別 HtmlTextWriter 的深度應用。
Render 方法簽章
protected virtual void Render(HtmlTextWriter output)
參數 output 為 HtmlTextWriter 實例,封裝輸出串流與格式化功能。
HtmlTextWriter 核心成員分類
標記屬性與樣式寫入
| 方法 | 用途 |
AddAttribute(name, value) | 為下一個 RenderBeginTag 產生的元素加入屬性 |
AddStyleAttribute(name, value) | 為下一個元素加入內嵌樣式屬性 |
WriteAttribute(name, value) | 直接寫入屬性至輸出串流 |
標記元素寫入
| 方法 | 用途 |
WriteBeginTag(tagName) | 寫入開始標記(含縮排) |
WriteEndTag(tagName) | 寫入結束標記(含縮排) |
RenderBeginTag(tagName) | 寫入開始標記並套用先前 AddAttribute/AddStyleAttribute |
RenderEndTag() | 寫入結束標記,配對 RenderBeginTag |
內容寫入
| 方法 | 用途 |
Write(object) | 寫入任意型別(呼叫 ToString),含縮排 |
Write(string) | 寫入字串 |
WriteLine(string) | 寫入字串並換行 |
格式化控制屬性
| 屬性 | 說明 |
Encoding | 取得輸出編碼(預設 UTF-8) |
Indent | 取得/設定縮排層級(Tab 數) |
NewLine | 取得/設定換行字串(預設 \r\n) |
ASP.NET 2.0 新增成員亮點
WriteAttribute(string name, HtmlTextWriterAttribute key, string value):強型別屬性鍵枚舉,避免拼字錯誤。
AddStyleAttribute(HtmlTextWriterStyle key, string value):強型別樣式鍵枚舉。
EncodeAttributeValue、EncodeUrl:內建編碼方法,防止 XSS。
IsAttributeDefined(key):檢查屬性是否已加入。
實作範例:自訂 Button 控制項 Render
protected override void Render(HtmlTextWriter writer)
{
// 開始按鈕標記
writer.AddAttribute(HtmlTextWriterAttribute.Type, "button");
writer.AddAttribute(HtmlTextWriterAttribute.Id, ClientID);
writer.AddAttribute(HtmlTextWriterAttribute.Name, UniqueID);
writer.AddAttribute(HtmlTextWriterAttribute.Value, Text);
writer.AddStyleAttribute(HtmlTextWriterStyle.FontSize, "12px");
writer.AddStyleAttribute(HtmlTextWriterStyle.Color, "#333");
writer.RenderBeginTag(HtmlTextWriterTag.Input);
writer.RenderEndTag(); // input 為自閉合標記,RenderEndTag 實際不輸出內容
}
Render vs RenderContents 選擇指南
| 場景 | 建議方法 |
繼承 Control(非 WebControl) | 覆寫 Render |
繼承 WebControl,需輸出外層標記(如 <div> 包裹) | 覆寫 Render |
繼承 WebControl,僅輸出內容,外層由基底處理 | 覆寫 RenderContents |
| 需精確控制完整 HTML 結構 | 覆寫 Render |
效能與安全最佳實務
- 避免字串串聯,直接
writer.Write 串流輸出。
- 使用者輸入內容務必
HttpUtility.HtmlEncode 或使用 writer.WriteEncodedText。
- 大量輸出考慮
StringWriter 緩衝後一次寫入。
- 善用
Indent 產生可讀 HTML,除錯友善(生產環境可關閉)。
掌握 HtmlTextWriter 豐富 API,能撰寫高效能、安全、標準相容的自訂控制項呈現邏輯,是進階伺服器控制項開發的核心技能。