Nodes
Helper Nodes
Map & MapIdx
Map Map[E any](s []E, fn func(E) Node) Node
Applies a function to each element in a slice, returning a fragment containing all resulting child nodes.
Parameters
- s []E — Input slice of elements.
- fn func(E) Node — Function applied to each element that produces a Node.
Returns
- Node — A Fragment containing all nodes produced by mapping fn over s.
Usage Example
html.Map(users, func(u User) Node {
return html.Li(html.Text(u.Name))
})
MapIdx MapIdx[E any](s []E, fn func(E, int) Node) Node
Same as Map, but also passes the index of each element to the mapping function.
Parameters
- s []E — Input slice.
- fn func(E, int) Node — Function that receives the element and its index.
Returns
- Node — A Fragment containing all nodes produced by mapping fn over s with indices.
Usage Example
html.MapIdx(items, func(item string, i int) Node {
return html.Li(html.Text(fmt.Sprintf("%d. %s", i+1, item)))
})
Iter & Iter2
Iter Iter[T any](s iter.Seq[T], fn func(T) Node) Node
Iterates over a generic sequence (iter.Seq) and applies a function to each element, returning a fragment of nodes.
Parameters
- s iter.Seq[T] — Sequence to iterate over.
- fn func(T) Node — Function applied to each yielded element.
Returns
- Node — A Fragment containing all nodes produced by fn.
Usage Example
html.Iter(stream, func(value string) Node {
return html.P(html.Text(value))
})
Iter2 Iter2[K any, V any](s iter.Seq2[K, V], fn func(K, V) Node) Node
Iterates over a key/value sequence, applying a function to each pair.
Parameters
- s iter.Seq2[K, V] — Sequence yielding key–value pairs.
- fn func(K, V) Node — Function applied to each key/value pair.
Returns
- Node — A Fragment containing all nodes produced by fn.
Usage Example
html.Iter2(settings, func(k string, v any) Node {
return html.Div(
html.Strong(html.Text(k+":")),
html.Span(html.Text(fmt.Sprint(v))),
)
})
Conditional Rendering
If If(cond bool, item Item) Item
Returns item if cond is true, otherwise returns an empty fragment. Useful for conditional rendering in declarative markup.
Parameters
- cond bool — The condition to evaluate.
- item Item — The node to include if true.
Returns
- Item — Either item or an empty Fragment.
Usage Example
html.If(user.LoggedIn, html.P(html.Text("Welcome back!")))
IfFn IfFn(cond bool, fn func() Item) Item
Conditionally calls and returns the result of a function if cond is true.
Parameters
- cond bool — The condition to check.
- fn func() Item — Function returning a node to render if true.
Returns
- Item — Result of fn() or an empty Fragment.
Usage Example
html.IfFn(len(posts) > 0, func() Item {
return html.Ul(html.Map(posts, func(p Post) Node {
return html.Li(html.Text(p.Title))
}))
})
Switch-like Rendering
SwitchCase type SwitchCase[T comparable] struct
Represents a case for a switch-like conditional structure.
Fields
- Value []T — Values that trigger this case.
- Fn func() Item — Function that returns the node when matched.
- Default bool — Marks this case as the default.
Switch Switch[T comparable](expr T, cases ...*SwitchCase[T]) Item
Evaluates multiple cases against an expression, returning the node from the first match or a default case if present.
Parameters
- expr T — The value to test.
- cases ...*SwitchCase[T] — The cases to evaluate.
Returns
- Item — The matching node or an empty fragment.
Usage Example
html.Switch(status,
html.Case(html.P(html.Text("OK")), 200),
html.Case(html.P(html.Text("Not Found")), 404),
html.Default(html.P(html.Text("Unknown"))),
)
Case Case[T comparable](item Item, v ...T) *SwitchCase[T]
Creates a case that returns a static node when any of the values match.
Parameters
- item Item — The node to render.
- v ...T — Values to match.
Returns
- *SwitchCase[T] — The constructed case.
CaseFn CaseFn[T comparable](fn func() Item, v ...T) *SwitchCase[T]
Creates a case that runs a function if the case matches.
Parameters
- fn func() Item — Function producing the node.
- v ...T — Values to match.
Returns
- *SwitchCase[T] — The constructed case.
Default Default[T comparable](item Item) *SwitchCase[T]
Creates a default case that always returns the provided static node.
Parameters
- item Item — Node to render if no cases match.
Returns
- *SwitchCase[T] — Default case.
DefaultFn DefaultFn[T comparable](fn func() Item) *SwitchCase[T]
Creates a default case that executes the provided function when matched.
Parameters
- fn func() Item — Function producing the node.
Returns
- *SwitchCase[T] — Default case.
JSON Rendering
JSONNode type JSONNode struct
Represents a node that serializes arbitrary data as JSON, with optional indentation.
Fields
- Data any — The data to encode as JSON.
- Indent string — Indentation for formatted output.
WithIndent func (n *JSONNode) WithIndent(indent string) *JSONNode
Sets indentation for the JSON output and returns the node itself (builder-style).
Parameters
- indent string — The indentation prefix (e.g. " ").
Returns
- *JSONNode — The same node with updated indentation.
Render func (n *JSONNode) Render(w ChunkWriter) error
Implements rendering logic for JSON output. Serializes Data to JSON and writes it to the writer.
JSON JSON(data any) *JSONNode
Creates a new JSONNode that will serialize the given data as JSON.
Usage Example
html.Pre(html.JSON(map[string]any{
"name": "Alice",
"age": 28,
}).WithIndent("\t"))
Unsafe Raw HTML
type RawUnsafe string
Represents raw HTML content inserted directly into the output without escaping. Use cautiously — this bypasses HTML escaping and can introduce XSS vulnerabilities.
Implements
- Item
- Node
Render func (t RawUnsafe) Render(w ChunkWriter) error
Writes raw HTML directly to the output stream.
Usage Example
html.RawUnsafe("<b>Unescaped bold text</b>")
HTML Elements
A
A(items ...Item) *Element
Creates an HTML <a> (anchor) element for hyperlinks.
Abbr
Abbr(items ...Item) *Element
Creates an HTML <abbr> element representing an abbreviation or acronym.
Address
Address(items ...Item) *Element
Creates an HTML <address> element representing contact information.
Area
Area(items ...Item) *Element
Creates an HTML <area> element for defining clickable regions in an image map.
Article
Article(items ...Item) *Element
Creates an HTML <article> element representing self-contained content.
Aside
Aside(items ...Item) *Element
Creates an HTML <aside> element for tangentially related content or sidebars.
Audio
Audio(items ...Item) *Element
Creates an HTML <audio> element to embed sound content.
B
B(items ...Item) *Element
Creates an HTML <b> element for stylistically offset text (without semantic importance).
Base
Base(items ...Item) *Element
Creates an HTML <base> element specifying the base URL for relative URLs.
Bdi
Bdi(items ...Item) *Element
Creates an HTML <bdi> element isolating text for bidirectional formatting.
Bdo
Bdo(items ...Item) *Element
Creates an HTML <bdo> element to override text direction.
Blockquote
Blockquote(items ...Item) *Element
Creates an HTML <blockquote> element for extended quotations.
Body
Body(items ...Item) *Element
Creates an HTML <body> element representing the main document content.
Br
Br(items ...Item) *Element
Creates an HTML <br> element for line breaks.
Button
Button(items ...Item) *Element
Creates an HTML <button> element representing an interactive button.
Canvas
Canvas(items ...Item) *Element
Creates an HTML <canvas> element for drawing graphics.
Caption
Caption(items ...Item) *Element
Creates an HTML <caption> element defining a table’s title or caption.
Cite
Cite(items ...Item) *Element
Creates an HTML <cite> element for citing a creative work.
Code
Code(items ...Item) *Element
Creates an HTML <code> element for displaying code fragments.
Col
Col(items ...Item) *Element
Creates an HTML <col> element defining table columns.
Colgroup
Colgroup(items ...Item) *Element
Creates an HTML <colgroup> element grouping table columns.
DataEl
DataEl(items ...Item) *Element
Creates an HTML <data> element linking human-readable and machine-readable content.
Datalist
Datalist(items ...Item) *Element
Creates an HTML <datalist> element defining predefined options for inputs.
Dd
Dd(items ...Item) *Element
Creates an HTML <dd> element defining description list details.
Del
Del(items ...Item) *Element
Creates an HTML <del> element for deleted text.
Details
Details(items ...Item) *Element
Creates an HTML <details> element for collapsible disclosure widgets.
Dfn
Dfn(items ...Item) *Element
Creates an HTML <dfn> element marking a term being defined.
Dialog
Dialog(items ...Item) *Element
Creates an HTML <dialog> element for modal or non-modal dialogs.
Div
Div(items ...Item) *Element
Creates an HTML <div> element as a generic container.
Dl
Dl(items ...Item) *Element
Creates an HTML <dl> element representing a description list.
Dt
Dt(items ...Item) *Element
Creates an HTML <dt> element for a term in a description list.
Em
Em(items ...Item) *Element
Creates an HTML <em> element for emphasizing text.
Fieldset
Fieldset(items ...Item) *Element
Creates an HTML <fieldset> element used to group several form controls and labels.
Figcaption
Figcaption(items ...Item) *Element
Creates an HTML <figcaption> element that provides a caption or legend for its parent <figure>.
Figure
Figure(items ...Item) *Element
Creates an HTML <figure> element representing self-contained content, optionally with a caption.
Form
Form(items ...Item) *Element
Creates an HTML <form> element representing a section containing interactive controls for data submission.
H1
H1(items ...Item) *Element
Creates an HTML <h1> element for a top-level heading.
H2
H2(items ...Item) *Element
Creates an HTML <h2> element for a second-level heading.
H3
H3(items ...Item) *Element
Creates an HTML <h3> element for a third-level heading.
H4
H4(items ...Item) *Element
Creates an HTML <h4> element for a fourth-level heading.
H5
H5(items ...Item) *Element
Creates an HTML <h5> element for a fifth-level heading.
H6
H6(items ...Item) *Element
Creates an HTML <h6> element for a sixth-level heading.
Head
Head(items ...Item) *Element
Creates an HTML <head> element containing metadata and links for the document.
Header
Header(items ...Item) *Element
Creates an HTML <header> element for introductory or navigational content.
Hgroup
Hgroup(items ...Item) *Element
Creates an HTML <hgroup> element grouping heading elements and related content.
Hr
Hr(items ...Item) *Element
Creates an HTML <hr> element representing a thematic break between sections.
Html
Html(items ...Item) *Element
Creates an HTML <html> element representing the root element of a document.
I
I(items ...Item) *Element
Creates an HTML <i> element representing text set off for idiomatic or technical reasons.
Iframe
Iframe(items ...Item) *Element
Creates an HTML <iframe> element embedding another HTML page within the current one.
Img
Img(items ...Item) *Element
Creates an HTML <img> element embedding an image.
Input
Input(items ...Item) *Element
Creates an HTML <input> element for data entry controls.
Ins
Ins(items ...Item) *Element
Creates an HTML <ins> element representing inserted text.
Kbd
Kbd(items ...Item) *Element
Creates an HTML <kbd> element denoting user input text.
Label
Label(items ...Item) *Element
Creates an HTML <label> element labeling a form control.
Legend
Legend(items ...Item) *Element
Creates an HTML <legend> element that provides a caption for a <fieldset>.
Li
Li(items ...Item) *Element
Creates an HTML <li> element representing a list item.
Link
Link(items ...Item) *Element
Creates an HTML <link> element linking an external resource (like stylesheets or icons).
Main
Main(items ...Item) *Element
Creates an HTML <main> element representing the dominant content of the <body>.
MapEl
MapEl(items ...Item) *Element
Creates an HTML <map> element used with <area> to define image maps.
Mark
Mark(items ...Item) *Element
Creates an HTML <mark> element representing highlighted text for reference or emphasis.
Menu
Menu(items ...Item) *Element
Creates an HTML <menu> element representing an unordered list of items.
Meta
Meta(items ...Item) *Element
Creates an HTML <meta> element containing metadata that cannot be represented otherwise.
Meter
Meter(items ...Item) *Element
Creates an HTML <meter> element representing a scalar or fractional measurement.
Noscript
Noscript(items ...Item) *Element
Creates an HTML <noscript> element defining content shown when scripts are disabled.
Object
Object(items ...Item) *Element
Creates an HTML <object> element embedding external resources such as images or plugins.
Ol
Ol(items ...Item) *Element
Creates an HTML <ol> element representing an ordered (numbered) list.
Optgroup
Optgroup(items ...Item) *Element
Creates an HTML <optgroup> element grouping <option> elements within a <select>.
Option
Option(items ...Item) *Element
Creates an HTML <option> element representing an item in a selection list.
Output
Output(items ...Item) *Element
Creates an HTML <output> element representing the result of a calculation or user action.
P
P(items ...Item) *Element
Creates an HTML <p> element representing a paragraph of text.
Picture
Picture(items ...Item) *Element
Creates an HTML <picture> element for responsive images using multiple sources.
Pre
Pre(items ...Item) *Element
Creates an HTML <pre> element for preformatted text preserving whitespace.
Progress
Progress(items ...Item) *Element
Creates an HTML <progress> element showing task completion progress.
Q
Q(items ...Item) *Element
Creates an HTML <q> element representing a short inline quotation.
Rp
Rp(items ...Item) *Element
Creates an HTML <rp> element defining fallback parentheses for ruby annotations.
Rt
Rt(items ...Item) *Element
Creates an HTML <rt> element specifying the ruby text of a ruby annotation.
Ruby
Ruby(items ...Item) *Element
Creates an HTML <ruby> element representing ruby annotations, commonly for East Asian typography.
S
S(items ...Item) *Element
Creates an HTML <s> element rendering text with a strikethrough to indicate inaccuracy or irrelevance.
Samp
Samp(items ...Item) *Element
Creates an HTML <samp> element representing sample output from a computer program.
Script
Script(items ...Item) *Element
Creates an HTML <script> element embedding or referencing executable code such as JavaScript.
Search
Search(items ...Item) *Element
Creates an HTML <search> element representing a section dedicated to search functionality.
Section
Section(items ...Item) *Element
Creates an HTML <section> element representing a standalone section of a document.
Select
Select(items ...Item) *Element
Creates an HTML <select> element representing a drop-down list of options.
Slot
Slot(items ...Item) *Element
Creates an HTML <slot> element, part of the Web Components API, acting as a placeholder for child content.
Small
Small(items ...Item) *Element
Creates an HTML <small> element representing side-comments or fine print.
Source
Source(items ...Item) *Element
Creates an HTML <source> element specifying media sources for <picture>, <audio>, or <video>.
Span
Span(items ...Item) *Element
Creates an HTML <span> element as a generic inline container for phrasing content.
Strong
Strong(items ...Item) *Element
Creates an HTML <strong> element indicating strong importance or urgency.
Style
Style(items ...Item) *Element
Creates an HTML <style> element containing CSS styling declarations.
Sub
Sub(items ...Item) *Element
Creates an HTML <sub> element displaying subscript text.
Summary
Summary(items ...Item) *Element
Creates an HTML <summary> element defining a summary or caption for a <details> disclosure box.
Sup
Sup(items ...Item) *Element
Creates an HTML <sup> element displaying superscript text.
Table
Table(items ...Item) *Element
Creates an HTML <table> element representing tabular data.
Tbody
Tbody(items ...Item) *Element
Creates an HTML <tbody> element grouping the main content rows of a table.
Td
Td(items ...Item) *Element
Creates an HTML <td> element representing a data cell in a table.
Template
Template(items ...Item) *Element
Creates an HTML <template> element holding inert DOM fragments for later use.
Textarea
Textarea(items ...Item) *Element
Creates an HTML <textarea> element representing a multi-line text input control.
Tfoot
Tfoot(items ...Item) *Element
Creates an HTML <tfoot> element grouping the footer rows of a table.
Th
Th(items ...Item) *Element
Creates an HTML <th> element representing a header cell in a table.
Thead
Thead(items ...Item) *Element
Creates an HTML <thead> element grouping header rows in a table.
Time
Time(items ...Item) *Element
Creates an HTML <time> element representing a specific time or date.
Title
Title(items ...Item) *Element
Creates an HTML <title> element defining the document’s title.
Tr
Tr(items ...Item) *Element
Creates an HTML <tr> element defining a row in a table.
U
U(items ...Item) *Element
Creates an HTML <u> element representing underlined or annotated text.
Ul
Ul(items ...Item) *Element
Creates an HTML <ul> element representing an unordered (bulleted) list.
Var
Var(items ...Item) *Element
Creates an HTML <var> element representing a variable name in a mathematical or programming context.
Video
Video(items ...Item) *Element
Creates an HTML <video> element embedding a media player for video content.
Wbr
Wbr(items ...Item) *Element
Creates an HTML <wbr> element defining a word break opportunity.
Something wrong with this page?
Edit It