Super DOM

super_dom.js

var SD = {

    create: function( tag, attrs ) {
        tag = document.createElement( tag );
        for ( var attr in attrs ) tag[ attr ] = attrs[ attr ];
        return tag;
    },

    get: function( selector, context, undefined ) {
        var matches = {
            '#': 'getElementById',
            '.': 'getElementsByClassName',
            '@': 'getElementsByTagName',
            '*': 'querySelectorAll'
        }[ selector[ 0 ] ];
        return ( ( ( context === undefined ) ? document : context )[ matches ]( selector.slice( 1 ) ) );
    },

    css: function( el, o ) {
        for ( var prop in o )
            if ( o.hasOwnProperty( prop ) )
                el.style[ prop ] = o[ prop ];
    },

    insert: function( a, w, b ) {
        if ( w === 'in' ) b.appendChild( a );
        else if ( w === 'before' ) b.parentNode.insertBefore( a, b );
        else if ( w === 'after' ) b.parentNode.insertBefore( a, b.nextSibling );
    }

};

use.js

var foo = SD.create( 'div', {
    id: 'fooID',
    className: 'classBar',
    innerHTML: 'test',
    onclick: function() {
        alert( 'hi!' );
    }
} );

SD.insert( foo, 'in', document.body );

var bar = SD.get( '#fooID' );

SD.css( bar, {
    display: 'none'
} );