xom

Build DOM trees by misusing Proxy!

Features

• Dynamic wrapper for document.createElement and document.createElementNS.
• Use HTML or JavaScript attribute names.
• Automatically wrap other arguments in document.createTextNode.

Install

npm install --save xom

Usage

Basic package usage:

import { dom } from 'xom'
const { div, span, b, i } = dom

document.appendChild(
  div({className: 'banana'},
    span('ba', b('na'), i('na'))
  )
)

Customize Xom:

import { Xom } from 'xom'

class MyXom extends Xom {}
const x = MyXom.proxy()

document.appendChild(
  x.div({className: 'banana'},
    x.span('ba', x.b('na'), x.i('na'))
  )
)

Why?

It was one of the ways of using Proxy that struck me. There are better solutions for most situations.