近期在研究jQuery插件，

插件编写的目的是给已经有的一系列方法或函数做一个封装，以便在其它地方反复使用，方便后期维护。 

JQuery除了提供一个简单、有效的方式进行管理元素以及脚本，它还还提供了例外一种机制：即给核心模块添加自己的方法和额外的功能。通过这样的机制，Jquery同意我们自己创建属于我们自己的插件，提高我们在开发过程中的效率。

尽管在jQuery命名空间中，我们禁止使用了大量的javaScript函数名和变量名。可是仍然不可避免某些函数或变量名将于其它jQuery插件冲突。因此我们习惯将一些方法封装到还有一个自己定义的命名空间。 

第一个演示样例：

1.插件文件 MyFirstPlugin.js

注：用$.extend()把默认值和用户传进来的值是联合在一起，这样子的话，就把用户自己定义的值覆盖了默认用户的值。假设用户没定义值，就用系统自己定义的。

   this.each(function () { 这个前面加了一个 return。这样就实现了我们的链式操作。 

(function ($) {    $.fn.textHover = function (options) {        var defaultVal = {            Text: '鼠标悬浮事件',            ForeColor: 'red',            BackColor: '#B9FDD8'        };        //默认值        var obj = $.extend(defaultVal, options);        return this.each(function () {            var selObject = $(this);  //获取当前对象            var oldText = selObject.text();  //获取当前对象的Text            var oldBgColor = selObject.css("background-color"); //获取当前对象的背景色             var oldColor = selObject.css("color"); //获取当前对象的字体的颜色             selObject.hover(            function () {                selObject.text(obj.Text);  //进行赋值                selObject.css("background-color", obj.BackColor);                selObject.css("color", obj.ForeColor);             },            function () {                selObject.text(oldText);                selObject.css("background-color", oldBgColor);                selObject.css("color", oldColor);            }            );        });    }})(jQuery);

2.前台HTML代码

     
        
      
                   Hello world
      
        
      
        
      
                   哈哈  我是第二个 DIV        
      
        
      
                   哈哈  我是第三个 DIV        
      
     

3.JS代码

3.1导入jQuery库文件

3.2 JS代码

。。

' }).css("background-color", "#B1B0FE"); //初次载入的时候 给出改变其颜色 }); </script>

OK，到这里，一个简单的插件就完毕了。