你还不会创建jQuery插件 ？荐

         如何创建一个jQuery插件
为什么要创建jQuery插件 ？ 因为这样代码可以复用。我们有这样一个页面，页面上面有如下的文字(看源码)，我们想要的效果是，当鼠标移到链接的时候，用一个浮动的div来显示a标签的title内容.

这是通过js来完成的。假设有一个方法tooltip(), 你只需要调用这个方法就能达成你的愿望，就像这样：

      $('a.tooltip').tooltip({           rounded: true       });   

假设我们把插件命名为tooltip，则需要定义一个jQuery.tooltip.js文件。这样命名只是为了说明这是jQuery的插件，实际上你可以随便命名这个文件名。下面来开始写我们的插件：

(function($){   #   ...code })(jQuery);

插件的代码必须包含在这个格式里。这里要注意，要确保你没有使用别的js库，否则这个美元符$，会发生冲突，如果要避免产生这种冲突，你最好在插件里都使用jQuery字符来代替美元符。
我们首先来定义插件函数：

$.fn.tooltip = function(options) {     ...}


然后设置默认的参数：

   var        defaults = {           background : '#e3e3e3',           color : 'black',           rounded: false      },

然后再用setting变量来接收用户自定义的参数，使用extend方法来merge这些参数。

settings = $.extend({}, defaults, options);


现在要开始写方法了，用户如果使用这个插件的时候，传入的jquery dom对象可能不只是一个元素，我们需要给每个class为tooltip的a标签都绑定好这个事件，那么就需要迭代了，这里jquery提供了each方法：

    this.each(function() {           var $this = $(this);           var title = this.title;           ... ...    }


这里为什么要用$this呢？ 这是为了提醒自己，正在和jQuery对象打交道。
然后写鼠标事件等等，来看最后的代码：

(function($){    $.fn.tooltip = function(options) {                var          defaults = {            background: '#e3e3e3',            color: 'black',            rounded: false          },            settings = $.extend({}, defaults, options);                        this.each(function() {              var $this = $(this);              var title = this.title;                            if($this.is('a') && $this.attr('title') != '') {                  this.title = '';                  $this.hover(function(e) {                      // mouse over                      $('')                        .appendTo('body')                        .text(title)                        .hide()                        .css({                          backgroundColor: settings.background,                          color: settings.color,                          top: e.pageY + 10,                          left: e.pageX + 20                        })                        .fadeIn(350);                                            if(settings.rounded) {                      $('#tooltip').addClass('rounded');                    }                  }, function() {                      // mouse out                      $('#tooltip').remove();                  });               }                            $this.mousemove(function(e) {                  $('#tooltip').css({                      top: e.pageY + 10,                      left: e.pageX + 20                   });              });            });            // returns the jQuery object to allow for chainability.            return this;      }  })(jQuery); 


总结：
1. 这里有个小技巧，假如要定义多个变量：var a = {};var b = {};var c = {};可以这么写：vara = {},b = {},c = {};

2.插件代码里，循环内的this, 循环外的this，循环内的$(this)的关系， 实际上是jQuery对象和dom对象的关系。
页面上调用插件方法，插件方法内部的each外的this，则是jQuery对象，这个对象是个集合对象，也就是$('a.tooltip')这个对象，页面上共有2个class为tooltip的a标签。
jquery对象的$方法，返回的是jquery集合对象，里面的元素，如果你用get方法去调用得到的是dom，你用eq方法调用得到的是jquery对象，比如：$('a').eq(0)得到的是jquery对象$('a').get(0)得到的是dom对象，直接$('a')[0]得到的是dom对象，而jquery的each方法，我认为是迭代的是dom对象，而不是jquery对象，所以在each里面this是dom对象，而需要$(this)来得到jquery对象来进行操作 。把这个关系搞清楚就行了。