diff --git a/CHANGELOG.md b/CHANGELOG.md index e7799ce..4f79a16 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -17,6 +17,10 @@ A dependency update to an incompatible version is considered a breaking change. ## Unreleased +### Added + +- Eponymous JS helper function in readme + ## v0.1.0 - 2024-12-02 Initial release diff --git a/README.md b/README.md index 9e4e685..cbf765a 100644 --- a/README.md +++ b/README.md @@ -29,6 +29,39 @@ let page: String = html(( .unwrap(); ``` +## But what about that small helper function? + +Here it is in full, for posteriority: + +```js +function el(name, attributes, ...children) { + const element = document.createElement(name); + for (const [name, value] of Object.entries(attributes)) + element.setAttribute(name, value); + element.append(...children); + return element; +} +``` + +Use it like so: + +```js +const page = el("html", {}, + el("head", {}, + el("meta", { charset: "utf-8" }), + el("meta", { + name: "viewport", + content: "width=device-width, initial-scale=1", + }), + el("title", {}, "Example page") + ), + el("body", {}, + el("h1", { id: "heading" }, "Example page"), + el("p", {}, "This is an example for a ", el("em", {}, "simple"), " web page."), + ), +); +``` + ## License This entire project is dual-licensed under the [Apache 2.0] and [MIT] licenses.