flxels

Helper functions to create HTML elements in Javascript / Typescript

API

Create element specified by tag.

function el (tag: string): HTMLElement

Create styled element specified by tag and styles object.

type StylesObject = { [key: string]: string | StylesObject }

function styled (tag: string, styles: StylesObject): HTMLElement

Create styled or unstyled h1 element.

Styles object is optional.

function h1 (styles?: StylesObject): HTMLDivElement

div span h1 h2 p input button

Add class to specified element.

function add_class (element: HTMLElement, className: string): void

Remove class from specified element.

function remove_class (element: HTMLElement, className: string): void

Style specified element.

Adds a new css class on each call.

function style (element: HTMLElement, styles: StylesObject): void

Restyle specified element.

Assigns new css class.

function restyle (element: HTMLElement, styles: StylesObject): void

Add text node to specified element.

function add_text (element: HTMLElement, text: string): void

Remove text node from specified element.

If string passed instead of text node, removes string from textContent.

If no text arg passed, removes all text nodes.

function remove_text (element: HTMLElement, textNode?: Text): void