Ver Mensaje Individual
  #2 (permalink)  
Antiguo 21/05/2011, 09:10
Avatar de Aijoona
Aijoona
Colaborador
 
Fecha de Ingreso: mayo-2011
Ubicación: Buenos Aires
Mensajes: 779
Antigüedad: 13 años
Puntos: 343
Respuesta: Crear funciones que no sean clases.

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
  1. /**
  2.  * Ejemplo de estructura basica de framework
  3.  *
  4.  * La funcion global $ actua como factory para nuestros
  5.  * wrappers DOM
  6.  *
  7.  * @author Aijoona
  8.  */
  9. $ = (function() {
  10.     /**
  11.      * Este es nuestro constructor privado
  12.      */
  13.     function _$(id) {
  14.         this.element = document.getElementById(id);
  15.     };
  16.  
  17.     /*
  18.      * Distintos metodos...
  19.      */
  20.    
  21.     _$.prototype.css = function(prop, value) {
  22.         this.element.style[prop] = value;
  23.         return this;
  24.     };
  25.    
  26.     _$.prototype.hide = function() {
  27.         this.css('display', 'hidden');
  28.         return this;
  29.     };
  30.    
  31.     _$.prototype.show = function() {
  32.         this.css('display', 'block');
  33.         return this;   
  34.     };
  35.    
  36.     _$.prototype.html = function(html) {
  37.         if(html) {
  38.             this.element.innerHTML = html;
  39.             return this;
  40.         }
  41.         return this.element.innerHTML;
  42.     };
  43.    
  44.     // Devolvemos la funcion $
  45.     return function(id) {
  46.         return new _$(id);
  47.     }  
  48. })();
  49.  
  50. // Ejemplo
  51. $('main').html('HELLO WORLD').css('color', '#F00').show();
__________________
blog | @aijoona