willis v1.0.8

This used to be named esh.

A small utility for creating HTML objects in JS, and binding them to the DOM. Uses vanilla JS for DOM manipulations.

Comes out of the box configured for the skeleton CSS grid. This can be easily reconfigured to work with arbitrary grid css specifications.

Usage

var willis = new Willis()
$("body").append(willis.div({class:"container",id:"main"}))
$("#main").append(willis.h1("Fresh Header"))
$("#main").append(willis.button("Throw in some arabic أنا أحب العربىة"))

We can set up a basic form doing with the following:

willis.addElement("basicForm",willis.concatElem([
                                willis.row([
                                    willis.column(4, willis.label("Email")),
                                    willis.column(8, willis.input(["Email here","", "email"]))
                                ]),
                                willis.row([
                                    willis.column(4, willis.label("Password")),
                                    willis.column(8, willis.input(["Email here","","password"]))
                                ])])})
$("body").append(willis.basicForm())

Let's say you want to use a different grid based CSS layout system. Simply reconfigure esh:

willis.config.grid.column = (n) => {return `col=${n}`} // Now we're good for bootstrap!