frameworks - 轻型Javascript框架

我正在尝试创建一个小的Javascript“框架”，以便可以在我的油脂猴子脚本中使用。我只需要和基本功能，因此这就是为什么我选择不使用mooTools或DOMAssistant的原因。此外，我不会愚蠢地将DOMAssitant放入20KB的Greasemonkey脚本中!我只想要一小段整齐的代码段。

我的以下代码有一个小问题。我认为这是因为我要在$()中返回一个数组，所以我得到.setStyle不是函数错误消息。

var fmini = {
  $ : function(a) {
    var i=0,obj,d;
    var e = [];

    while (obj = arguments[i++]) {
      d = document.getElementById(obj);
      d.setStyle = fmini.setStyle;
      d.each = fmini.each;
      e.push(d);
    }

    return e;
  },
  setStyle : function(style, value) {
    if (typeof this.style.cssText !== 'undefined') {
      var styleToSet = this.style.cssText;
      if (typeof style === 'object') {
        for (var i in style)
          if (typeof i === 'string') styleToSet += ';' + i + ':' + style[i];
      }
      else styleToSet += ';' + style + ':' + value;
      this.style.cssText = styleToSet;
    }
    return this;
  },
  each : function (functionCall) {
                for (var i=0, il=this.length; i < il; i++)
                    functionCall.call(this[i]);
                return this;
    },
}
window.$ = fmini.$;

我想在我这样做的时候工作

  $('bob','amy').setStyle({
    'border' : '5px solid #ff0000',
    'background-color' : '#ccc'
    });

最佳答案

编写方法以对从$返回的节点集进行操作。这样，$('bob').setStyle()和$('bob', 'amy').setStyle()都可以工作。我看到您有一个通用的forEach或each方法，这是一个很好的开始。

var fmini = {
    $: function() {
        var i=0, obj;
        var e = [];
        e.setStyle = fmini.setStyle;
        e.each = fmini.each;

        while (obj = arguments[i++]) {
            e.push(document.getElementById(obj));
        }

        return e;
    },

    setStyle : function(style, value) {
        return this.each(function() {
            if (typeof this.style.cssText !== 'undefined') {
                var styleToSet = this.style.cssText;
                if (typeof style === 'object') {
                    for (var i in style)
                        if (typeof i === 'string') styleToSet += ';' + i + ':' + style[i];
                }
                else styleToSet += ';' + style + ':' + value;
                this.style.cssText = styleToSet;
            }
        })
    }
}

顺便说一句，这是jQuery第一次被执行/流行。