HtmlBuilder is a C# class library building HTML documents. It depends on .NET Standard 2.1.

Get started

Maroontress.HtmlBuilder is available as the NuGet-logo NuGet package.

Examples

Elements

Generate the HTML document with HtmlBuilder as follows:

<html>
  <head>
    <title>My first web page</title>
  </head>
  <body>
    <p>Hello, World!</p>
  </body>
</html>

The following code provides the string result, which represents the same HTML document (but it does not contain indentation or line breaks).

var nodeOf = Nodes.NewFactory();
var html = nodeOf.Html.Add(
    nodeOf.Head.Add(
        nodeOf.Title.Add("My first web page")),
    nodeOf.Body.Add(
        nodeOf.P.Add("Hello, World!")));
var result = html.ToString();

See the result in .NET Fiddle

Attributes

You can manipulate the HTML attributes as follows:

var nodeOf = Nodes.NewFactory();
var codeFragment = nodeOf.Pre.AddAttributes(("lang", "csharp"))
    .Add("var list = new List<string>();");
var result = codeFragment.ToString();

The string result represents as follows:

<pre lang="csharp">var list = new List&lt;string&gt;();</pre>

See the result in .NET Fiddle

You can generate the empty attribute as follows:

var nodeOf = Nodes.NewFactory();
var div = nodeOf.Div
    .Add(nodeOf.Input.AddEmptyAttributes("disabled"))
    // Or, specify null to the value.
    .Add(nodeOf.Button.AddAttributes(("disabled", null)));
var result = div.ToString();

The string result represents as follows:

<div>
  <input disabled>
  <button disabled></button>
</div>

See the result in .NET Fiddle

Note that you need to handle the id and class attributes with the following dedicated methods:

var nodeOf = Nodes.NewFactory();
var header = nodeOf.H1.WithId("intro")
    .WithClass("title", "anchor")
    .Add("Introduction");
var result = header.ToString();

The string result represents as follows:

<h1 id="intro" class="title anchor">Introduction</h1>

See the result in .NET Fiddle

Node objects are immutable, so the Prototype pattern can be applied as follows:

var nodeOf = Nodes.NewFactory();
var reverseSpan = nodeOf.Span.WithClass("reverse");
var para = nodeOf.P.Add(
    reverseSpan.Add("reversed text"),
    nodeOf.Text(" means the console output. For example, "),
    reverseSpan.Add("low battery"),
    nodeOf.Text(" and so on."));
var result = para.ToString();

The string result represents as follows:

<p><span class="reverse">reversed text</span> means the console output.
For example, <span class="reverse">low battery</span> and so on.</p>

See the result in .NET Fiddle

Character References

To include Character References, use CharacterReference method as follows:

var nodeOf = Nodes.NewFactory();
var span = nodeOf.Span.Add(
    nodeOf.CharacterReference(0x1f5fc));
var result = span.ToString();

The string result represents as follows:

<span>&#x1F5FC;</span>

See the result in .NET Fiddle

Named Character References

To include Named Character References, use Entity property as follows:

var nodeOf = Nodes.NewFactory();
var span = nodeOf.Span.Add(
    nodeOf.Text("Copyright "),
    nodeOf.Entity.copy,
    nodeOf.Text(" 2019"));
var result = span.ToString();

The string result represents as follows:

<span>Copyright &copy; 2019</span>

See the result in .NET Fiddle

Format

To contain indentation and line breaks in the result string, use the ToString(FormatOptions) method as follows:

var nodeOf = Nodes.NewFactory();
var html = nodeOf.Html().Add(...);
var result = html.ToString(FormatOptions.DefaultIndent);

Documents

How to contribute

Please send us pull requests or issues from the GitHub icon GitHub repository.