Te adjunto un pequeño ejemplo, que basicamente es la estructura que respeta jQuery, Zepto y algun otro framework. A fines de simplificar, solo acepta selectores ID.
Aca tenes este ejemplo online:
http://blog.aijoona.com/wp-content/uploads/2011/05/fw.html
Si tenes alguna duda PUNTUAL no molesta la consulta.
Código Javascript
:
Ver original/**
* Ejemplo de estructura basica de framework
*
* La funcion global $ actua como factory para nuestros
* wrappers DOM
*
* @author Aijoona
*/
$ = (function() {
/**
* Este es nuestro constructor privado
*/
function _$(id) {
this.element = document.getElementById(id);
};
/*
* Distintos metodos...
*/
_$.prototype.css = function(prop, value) {
this.element.style[prop] = value;
return this;
};
_$.prototype.hide = function() {
this.css('display', 'hidden');
return this;
};
_$.prototype.show = function() {
this.css('display', 'block');
return this;
};
_$.prototype.html = function(html) {
if(html) {
this.element.innerHTML = html;
return this;
}
return this.element.innerHTML;
};
// Devolvemos la funcion $
return function(id) {
return new _$(id);
}
})();
// Ejemplo
$('main').html('HELLO WORLD').css('color', '#F00').show();