Qual é a melhor maneira de criar HTML em código C #? [fechadas]


15

Eu acredito que a marcação deve permanecer na marcação e não no código por trás.

Cheguei a uma situação em que acho aceitável criar o HTML no código por trás. Eu gostaria de ter algum consenso sobre quais são as melhores práticas ou deveriam ser.

Quando é aceitável criar html no código por trás? Qual é o melhor método para criar este html? (exemplo: Strings, StringBuilder, HTMLWriter, etc)


tente usar modelos e espaços reservados onde você cuspirá essas marcações html.
Yusubov 17/10/12

5
Outra opção: produza XML com base em seu modelo de dados e use XSLT para transformar o XML em HTML.
FrustratedWithFormsDesigner

Acabei de chegar ao meu conhecimento hoje C # / XAML para HTML5, parece promissor e pode se adequar ao seu cenário. cshtml5.com
softveda

um problema com a rota XSLT está na localização. Se você precisar de dois idiomas, precisará de duas folhas de estilo XSLT e as manterá paralelas. Isso é o inferno. Melhor basta escrever HTML em um arquivo de texto em C #. use String.Format e $ ".. {variable} ..." junto com WPFLocalization?
Erik

Respostas:


12

O uso de algo como o Razor não se aplica aqui? Porque se você está gerando muita geração de html usando um mecanismo de exibição, pode ser muito mais fácil. Também foi criado para ser usado fora do ASP.NET.

No entanto, às vezes não é isso que você precisa. Você já pensou em usar a classe TagBuilder, que faz parte do .net (mvc)? Há também o HtmlWriter no System.Web.UI (para formulários da Web). Eu recomendaria um desses se você estiver fazendo Controlsou Html Helpers.


3
+1, se você precisar de modelos dentro de um aplicativo de barbear é o caminho a percorrer. Confira razorengine @ nuget.org/packages/RazorEngine se você precisar de uma ótima opção para montar navalhas em um aplicativo que não seja o asp.net.
Wyatt Barnett

1
Eu tenho um requisito semelhante, onde eu preciso gerar html (cargas dele) em uma biblioteca de classes. Eu quero usar navalha para isso, mas luta para entender como manter arquivos cshtml em uma DLL. Como ele pode se agrupar?
Yashvit

Você pode simplesmente passar qualquer string stackoverflow.com/questions/3628895/…
Daniel Little

14

Eu usaria o Html Agility Pack para montar o HTML e depois gravá-lo em um arquivo de texto.

Muitas horas de trabalho foram dedicadas a tornar o Html Agility Pack robusto e compatível com HTML.

Eu acho que inclui até um aplicativo de exemplo que gera HTML.

Na página inicial:

Aplicações de exemplo:

Fixação ou geração de página. Você pode consertar uma página da maneira que desejar, modificar o DOM, adicionar nós, copiar nós, bem ... o nome dela.


5

Eu usaria htmltags para criar HTML.

Exemplo:

var tag = new HtmlTag("span")
    .Text("Hello & Goodbye")
    .AddClass("important")
    .Attr("title", "Greetings")

E então CSQuery se eu quiser analisar HTML

Exemplo:

dom.Select("div > span")
    .Eq(1)
    .Text("Change the text content of the 2nd span child of each div");

2

Obviamente, existem bibliotecas por aí, como o HTML Agility Pack, que podem ajudá-lo nesses empreendimentos.

Se você realmente não deseja usar uma biblioteca existente e deseja um código simples e simples, eu gosto da idéia de abstrair alguns comportamentos, como uma resposta anterior. Também gosto da idéia de usar um StringBuilder subjacente, em vez de uma string por duas razões:

  1. Strings são menos eficientes que o construtor de strings
  2. StringBuilder é uma estrutura de dados indexável,

Se eu não precisar de um mecanismo HTML de engenharia massiva, criaria uma interface simples e intuitiva

AddLineBreak();
AddSimpleTag(string tagName);
AddSimpleTagAt(string tagName, string content, int index);
Output();

1
A estrutura de dados indexável é atraente, mas eu não me preocuparia muito muito sobre a eficiência: codinghorror.com/blog/2009/01/...
Jim G.

1
Eu fiquei um pouco algumas vezes com o peso das Strings, especialmente as REALMENTE grandes. Os StringBuilders são mais eficientes na memória e no processador quando crescem. Então, em uma implementação como essa, onde o HTML pode ficar muito grande, eu começaria com um StringBuilder. Se houvesse uma garantia de que o HTML não ficaria muito grande, uma string certamente seria adequada.
Tim C

1
Bem, se o HTML pode ficar muito grande, eu certamente recomendaria o HTML Agility Pack. [Na verdade, eu recomendei o HTML Agility Pack dois minutos antes de você. :)]
Jim G.

1

Se você acabar usando apenas strings, não se esqueça de escapar de todos os caracteres reservados em HTML nos dados de saída.

&    &
>    >
<    &lt;
"    &quot;
'    &apos;

Eu recomendo usar uma classe ou biblioteca compatível com HTML em vez de trabalhar diretamente com cadeias de caracteres. HTMLWriter parece um bom começo.


Obrigado por esse insight. Para quem quer que isso possa ler, é isso que eu uso para passar os valores de uma tabela de dados em um modelo de item. A chave é (como Mike Clark sugere) estar ciente de HTML: <asp: ID do botão = "btnEdit" CssClass = "btnmaatwerksmall" runat = "server" Texto = "Wijzig" OnClientClick = '<% # String.Format ("OpenChildInEnterprise ('{0}', '{1}', '{2}'); ", Eval (" Cursus "), Eval (" Omschrijving "), Eval (" Opmerking ")% > '/>
real_yggdrasil

-1

Quase dois anos após o post original - aqui está uma solução que funcionou bem para mim. No documento de destino, coloco o seguinte:

<table>    
    <%:theHtmlTableMomToldYouAbout() %>    //# Where I want my rows of table data to go
</table>

a função que está sendo chamada se parece com isso:

    public HtmlString theHtmlTableMomToldYouAbout()
    {
        string content = "";
        HtmlString theEnvelopePlease = null;

        for (int i = 0; i < 5; i++)
        {
            content = content + "<tr><td>The Number Is: " + i + "</td></tr>";
        }
        theEnvelopePlease = new HtmlString(content);
        return theEnvelopePlease;      
    }

E a saída resultante no navegador é a esperada:
O número é: 0
O número é: 1
O número é: 2
O número é: 3
O número é: 4

Quando vou exibir a fonte, encontro o seguinte:

<table>
    <tr><td>The Number Is: 0</td></tr>
    <tr><td>The Number Is: 1</td></tr>
    <tr><td>The Number Is: 2</td></tr>
    <tr><td>The Number Is: 3</td></tr>
    <tr><td>The Number Is: 4</td></tr>
</table>

1
Apontarei que sua solução tem muitos dos mesmos problemas, com o 'conteúdo' sendo uma sequência imutável, conforme descrito nas postagens de baixa pontuação desta pergunta.

-1

CHAME ON!

var html = "";
html += "<table class='colorful'>";
foreach(var item in collection) {
     html += "<tr>";
     html += "<td class='boldCell'>" + item.PropWhatever + "</td>";
     // more cells here as needed
     html += "</tr>";
}
html += "</table>";
placeholder1.InnerHtml = html;

Provavelmente vou ser votado por isso, mas como um ex-designer que precisou ajustar o código HTML antes que eu realmente soubesse muito sobre o .NET, o código acima era muito mais fácil de entender do que os métodos que abstraem a criação de HTML. Se você acha que um designer pode precisar ajustar seu HTML, use sequências simples como esta.

Algo que muitos desenvolvedores sentem falta quando escrevem HTML no código é que, no HTML, aspas simples ou duplas são permitidas para atributos. Portanto, em vez de escapar de todas as aspas no código (o que parece um absurdo para os não iniciados), use aspas simples para as aspas html dentro de suas strings.


BEM. Todos os que odeiam concatenar cordas estão apertando meu representante. Aqui está a maneira 'adequada' de fazer isso sem concatenação de strings, mas defendo minha opinião de que qualquer página normal com tabelas normais não apresentará problemas de desempenho fora de uma escala ridícula do tipo Google:

var sb = new System.Text.StringBuilder();
sb.Append("<table class='colorful'>");
foreach (var item in collection)
{
     sb.Append("<tr>");
     sb.Append("<td class='boldCell'>" + item.PropWhatever + "</td>");
     // more cells here as needed
     sb.Append("</tr>");
}
sb.Append("</table>");
placeholder1.InnerHtml = sb.ToString();

3
-1 usando + para concatenar strings em loops é a pior coisa que você pode fazer.
Daniel Little


Bem, para iniciantes, usar +=dentro de um loop dessa maneira não é escalável; como as strings são imutáveis, você cria uma nova string toda vez que faz isso. Use um em StringBuildervez disso.
Robert Harvey

3
Por que as pessoas que escrevem código horrível compartilham seu código horrível com outras pessoas.
Ramhound 18/10/12

3
@ Ramhound Que tal If you think a designer might ever have to tweak your HTML, use simple strings like this.é difícil de entender? A definição de código horrível para algumas pessoas é aquela que compra milissegundos de desempenho com o custo de levar muitos segundos para entender completamente. Claramente, quando você antecipa que seu código é visualizado ou mantido pelo menor denominador comum de indivíduo, pode-se certamente afirmar que escrever um código mais fácil de entender ou ajustar é sempre melhor do que o código mais limpo ou com melhor desempenho.
Maple_shaft
Ao utilizar nosso site, você reconhece que leu e compreendeu nossa Política de Cookies e nossa Política de Privacidade.
Licensed under cc by-sa 3.0 with attribution required.