ThinAir: Create DOM Elements Without Sweating

Announcing yet another tiny javascript library: ThinAir.

ThinAir is a DSL for creating DOM elements on-the-fly. Example, if you want to create a text input:

var elm = thinair.input({type: 'text', name: 'name', value: 'Bobby'})

But, having to write "thinair." everywhere makes the code pretty cluttered as soon as you start doing some complicated stuff. One way to avoid having to write the namespace is using the with keyword:

with(thinair){  var elm = input({type: 'text', name: 'name', value: 'Bobby'})}

Within the scope of the with statement you can use all the tag-named methods unadorned. Now, let's try something else... A paragraph containing a checkbox and a label? You got it:

var elm =
  p(
    input({type: 'checkbox', name: 'checkme'}),
    label('Check me, please!')
  )

At this point elm is a jQuery wrapped element, so you can add it to the DOM by using one of jQuery's standard ways of inserting it, for example:

$(document.body).append(elm)

To generate a unordered list out of an array of elements:

ul(['bobby', 'timmy', 'barry'].map(function(name){
  return li(name)
})

A more elaborate example is here. That's really about all I wanted to show. The code/project page is on github.