我們知道製作一個控件，一般比只實現同樣功能的模組要複雜，因為我們需要考慮更多的異常和適應性，才能達到我們整合和復用程式碼的效果。而當我們開發一個ASP.NET控制項時，不管我們的控制項有多麼複雜的功能和UI表現，我們最終在客戶端瀏覽器裡得到的都只是HTML程式碼和腳本的組合。
而就是這些控制項產生的HTML程式碼，它們的格式是不是就可以隨意處理呢。那不能隨意又是什麼意思？難道我們必須確保HTML程式碼的排版，並且保持HTML良好的層次縮排什麼的嗎？這裡剛好相反，我們因該盡量去掉和控制HTML程式碼沒有關係的任何東西，包括"無用的"空格和回車。為什麼要強調無用的呢？我們知道瀏覽器在處理HTML原始碼時，對於其中連續的空格和回車，都是按一個空格來處理並顯示的。所以，似乎我們不用在意ASP.NET控制在Render時，HTML程式碼前後或中間多出的無用空格或回車。那我們就來看看下面這個範例： <img id="analysisChart" src="ChartPic_000007.jpeg?B9FA64E7-2020-4430-AAF4-B20A51794909" map="#usemap_analysisChart">
<map id="usemap_analysisChart">
<area>...<area>
</map>
'www.downcodes.com
上面這個程式碼片段是Dundas Web Controls中的Web Chart控制項輸出的HTML程式碼。這個有hot area的Chart圖片在使用時似乎沒有什麼問題，如果就是普通的單獨使用這個Chart，確實是沒有問題。可是當我們把Dundas Chart組合到自訂的WebControl中時，它這種有換行和縮排的HTML程式碼就帶來問題了。由於佈局的需要，我需要把這個Chart放入一個表格之中，並讓表格顯示一個像素的border緊密包圍Chart。本來這個Chart的外觀就只是一個圖片而已，這樣的組合似乎應該沒有任何問題，可實際情況是那個Chart的圖片始終不能撐滿外面的表格(如下圖)，而在圖片底部和表格底邊上總是有3-4個像素的間隙。而這個間隙就是由於<img />和<map>之間有空格和換行(雖然IE只當它是一個空格)造成的。
|
由於Dundas Web Chart是發布的已經編譯好的dll，所以要刪除它輸出的HTML中無用的空格和回車就變的比較麻煩了。我們只能從它的Render流中把HTML程式碼取出，然後手動的去掉tags之間的空格和回車，再輸出到新控制的輸出流中去。這樣的方法雖然可以解決一部分問題，可是如果遇到內部控制過於複雜，這時不管在正確性還是效率上就都是額外的負擔。
所以從上面的問題我們看出，當我們製作一個ASP.NET控制項時，因該讓最後呈現的HTML程式碼遵循"程式碼緊湊原則"，以提高控制項的適應性。在這樣的原則下先前那個例子就應該這樣：
<img id="analysisChart" src="ChartPic_000007.jpeg?B9FA64E7-2020-4430-AAF4-B20A51794909" usemap="#usemap_analysisChart"><map id="map_anaaresis. map>
這樣一來Chart圖片就和包圍它的表格邊框緊密挨在一起了。