在 ASP.Net MVC 的 HTML Helper 中使用 TagBuilder

前言

在 ASP.Net MVC 中最重要的就是有許多好用的 Helper 可以使用，當然也可以很方便的來擴充它，而擴充的方式也很容易，如下所示的程式碼就是最基本的方法，最重要的就是第一個參數是 this HtmlHelper html 就可以囉！

而在擴充方法裡面的的程式就是產生我們想要的 HTML ，在 .Net 裡也提供了一個新的類別 TagBuilder 來幫助我們快速又方便的建立 Html Tag 的字串，而實作的範例就在後面說明了。

實作

首先先來做一個簡單的範例，因為 ASP.net MVC 內建沒有提供 img 標籤的 Helper，所以我們來實作一個。

其中我們用 img 來當做建構子參數，並且使用 MergeAttribute 方法來新增 Tag 裡面的 Attribute，因為 MVC3 預設會對 string 編碼，為了方便使用我把回傳的類別改成 MvcHtmlString，最後呼叫 ToString 方法來產生字串，如此一來就可以產生如下的 HTML 碼了。

而我們要怎麼在 View 裡面呼叫呢？先 using 方法在的 namespace ，然後就是我們一般使用 Helper 的方式來呼叫就可以囉！

那如果我們要建立像 a 標籤裡面會包含文字的標籤該怎麼做呢？這時候有兩種方式：

1. SetInnerText 方法
2. InnerHtml 屬性

這兩種方式的差別在於 SetInnerText 方法會把傳入的字串先做 HTML 編碼，因此要使用哪種方式就看個人需求囉！最後程式碼如下：

產生的 HTML 如下：

呼叫語法如下：

但是應該會有網友想說：如果我有很多屬性，或是想自定屬性，如此一來方法的參數不就會烙烙長，這個疑問我們也可以用 MergeAttributes 方法來解決，就可以一次新增一堆我們要的屬性囉！

產生的 HTML 如下：

呼叫方法如下：

結論

上面實作的範例應該就可以處理掉我們許多想自定 Helper 的需求了，此外 TagBuilder 的 ToString 方法還有許多的多載，也可以產生不同結果，有興趣的網友可以參考下面的參考資料囉！

參考資料

TagBuilder 類別(MSDN)

ASP.NET MVC 使用 TagBuilder

ASP.NET MVC 你一定要知道怎麼創立HTML Helper