1.1.0 • Published 6 years ago

hotml v1.1.0

Weekly downloads
2
License
MIT
Repository
-
Last release
6 years ago

H🔥TML

Build Status npm version gzip size

Tiny helper(353 bytes) for creating complex DOM structues. Can be used as a target for JSX.

Example:

const list = h.ul({class: 'list'}, [
  h.li({ onClick: (event) => {}}, 'one'),
  h.li({}, 'two')
]);

document.body.appendChild(list);

API

h.[type](attrs, children | text)

  • type - type of element to create(ul, li, button etc)
  • attrs - object with attributes to be applied to the element
  • children - array of children

Any attribute that starts with on will be treated as an event handler. For example, onClick will turn into addEventHandler('click').

With JSX

Use babel-transform-react-jsx to turn JSX into h🔥tml-calls:

{
  "plugins": [
    ["transform-react-jsx", { "pragma":"h" }]
  ]
}