TagBuilder是构建HTML元素的一个很好的实现。但是-some-HTML元素可以有另一个元素(我称之为子元素)。我找不到Mvc课程的任何课程。
问题;我应该实现几个支持嵌套标签的类(TagBuilderTree和TagBuilderNode),还是我错过了什么?
答案 0 :(得分:44)
您可以在单独的TagBuilders中构建子元素,并将其生成的HTML放在父TagBuilder中。
以下是一个例子:<select>
有一些<option>
s(例如为了简洁而减肥)
TagBuilder select = new TagBuilder("select");
foreach (var language in languages) // never ye mind about languages
{
TagBuilder option = new TagBuilder("option");
option.MergeAttribute("value", language.ID.ToString());
if (language.IsCurrent)
{
option.MergeAttribute("selected", "selected");
}
option.InnerHtml = language.Description;
// And now, the money-code:
select.InnerHtml += option.ToString();
}
答案 1 :(得分:5)
好的,我决定在我自己的代码库中进行一些测试。
我比较了这两种方法来创建完全相同的HTML:
使用StringBuilder手动生成html:
var sb = new StringBuilder();
sb.AppendLine("<div class='control-group'>");
sb.AppendFormat(" <label class='control-label' for='{0}_{1}'>{2}</label>", propObj.ModelType, propObj.ModelProperty, propObj.LabelCaption);
sb.AppendLine(" <div class='controls'>");
sb.AppendFormat(" <input id='{0}_{1}' name='{0}[{1}]' value='{2}' />", propObj.ModelType, propObj.ModelProperty, propObj.PropertyValue);
sb.AppendLine(" </div>");
sb.AppendLine("</div>");
return new HtmlString(sb.ToString());
使用多个TagBuilder并合并内容:
TagBuilder controlGroup = new TagBuilder("div");
controlGroup.AddCssClass("control-group");
TagBuilder label = new TagBuilder("label");
label.AddCssClass("control-label");
label.InnerHtml = propObj.LabelCaption;
TagBuilder controls = new TagBuilder("div");
TagBuilder input = new TagBuilder("input");
input.Attributes["id"] = propObj.ModelType + "_" + propObj.ModelProperty;
input.Attributes["name"] = propObj.ModelType + "[" + propObj.ModelProperty + "]";
input.Attributes["value"] = propObj.PropertyValue;
controls.InnerHtml += input;
controlGroup.InnerHtml += label;
controlGroup.InnerHtml += controls;
return new HtmlString(controlGroup.ToString());
对我来说,#1更容易阅读,更简洁,但我也很欣赏#2的结构。
答案 2 :(得分:-2)
我使用TagBuilder创建标签的问题是它看起来非常难以维护。另一方面,StringBuilder的AppendFormat不仅使代码可维护,而且运行效率很高。
我对MattSlay的#1方法略有改进。我只使用了一次对StringBuilder的AppendFormat方法的调用,并使用C#字符串文字来定义格式。因此,格式最终看起来与所需结果完全相同,并且效率高。
var sb = new StringBuilder();
sb.AppendFormat(
@"<div class='control-group'>
<label class='control-label' for='{0}_{1}'>{2}</label>
<div class='controls'>
<input id='{0}_{1}' name='{0}[{1}]' value='{3}' />
</div>
</div>",
propObj.ModelType,
propObj.ModelProperty,
propObj.LabelCaption,
propObj.PropertyValue);
return new HtmlString(sb.ToString());
希望这有帮助!