javascript - 用于 JQuery 选择器的 Mixin

Question

是否可以为jQuery选择器创建一个 mixin（请注意，我不需要插件，它们对于我正在做的事情来说太笨重了）？

这是我要完成的任务：

  // Given a div I need to paint it with green for which...
  var $container = $("#id001");

  // current solution
  var do = function(e) {

     var container = e.container;
     container.css("backgroudColor", "green");
  };

  do({ container: $container }); // call


  // desired solution
  var do**Mixin** = function(e){
     e.css("backgroudColor", "green");
  };

  container.do(); // call

Answer 1

我知道您说您不需要插件，但是您需要的插件非常简单：

function($){
    $.fn.makeItGreen = function(){
        return this.each(function() {
            this.css({
                'background-color': 'green'
            });
        });
    }
)(jQuery));

利用：

$(yourSelector).makeItGreen();

未经测试，但是....很确定它应该按原样工作。

小提琴（由 Jamiec 提供）：

http://jsfiddle.net/mPu6X/

Answer 2

你在寻找这样的东西吗？http://jsfiddle.net/WDmjS/

​jQuery.prototype.do = function(){
    this.css("background-color","green");
    return this;
};

$(".mydiv").do();

更简洁的写法：

​$.fn.do = function(){
    return this.css("background-color","green");
};

Answer 3

您可以进行自定义事件：

$('selector').on('changeToGreen', function(){
    $(this).css("backgroudColor", "green");
});

去做吧：

$('selector').trigger('changeToGreen');