tagged-html v0.0.1

tagged-html

A tiny library for safely templating small amounts of HTML using template strings.

import * as HTML from 'tagged-html';

const foods = ["🍉", "🥝", "🥗"];
document.body.appendChild(HTML.fragment`
  <p>Hello, world! Have some fruit:</p>
  <ul>
    ${foods.map(food => HTML`<li>${food}</li>`));
  </ul>
`);

HTML`...`, HTML.escape(...), and HTML.unsafeRaw(...) return an HTML object that must be converted to a string by calling .toString(), or interpolated into one of these tag functions as an intermediate value.

HTML.string`...` returns the HTML as a string.

HTML.element`...` parses the HTML and returns an Element if it contains exactly one, else throws an error.

HTML.fragment`...` parses the HTML and returns the contents as a DocumentFragment.

Interpolated values (except for HTML`...` objects) are HTML-encoded, so they are safe inside text and attribute bodies, but should not be used elsewhere. Do not interpolate values into <script> tags or other JavaScript contexts.