xneek-crel v2.0.1

crEl

A small constructor for generated DOM elements

Cross-browser, Lightweight, No dependencies;

##How it works ###What you need to get

<a href="#" class="btn">Click me</a>

###In the past

var a = document.createElement('a');
    a.setAttribute('href','#');
    a.setAttribute('class','btn');
    a.appendChild(document.createTextNode("Click me"))

###Right now

var a = crEl('a',{href:'#', c:'btn'}, "Click me")

##Docs

crEl(tagName,[attr, child-1,... child-n]) // return DOM element

c - is alias for "class" attribute s - is alias for "style" attribute d - for set data-* attributes e - for attach events

##Examples

    crEl('hr'); // return <hr> DOM element

    crEl('div',{c:'jumbotron'}); // return <div> DOM element with class jumbotron

    crEl('a',{href:'#'}, "link", crEl('sup',{ d:{role:'badge'}, s:'color:red'},"NEW")); 
    // return <a href="#">link<sup data-role="badge" style="color:red">NEW</sup></a>

    crEl("button",{e:{click:function(){alert('Ololo');}}},"Click Me"); // button with event click

    crEl('ul',{c:'menu', id:'menu'},
            crEl('li', crEl('a', {href:'#1'},"Link-1")),
            crEl('li', crEl('a', {href:'#2'},"Link-2")),
            crEl('li', crEl('a', {href:'#3'},"Link-3")),
    ); // typical menu

    var i = 0, menu = document.getElementById('menu');
    while(i<=100500){//to add 100500 items to the menu
        menu.appendChild( crEl('li', crEl('a', {href:'#'+i},"Link-"+i)) ); 
        i++;
    }

##Simple converter HTML⇨crEL http://fednik.ru/f/crel/