jquery插件制作教程txtHover_jquery
                        
                            时间:2021-07-01 10:21:17
                            帮助过:24人阅读
							                        
                     
                    
                    定义插件的结构骨架: 
  书中最开始使用的结构骨架如下: 
 代码如下:
 
jQuery.fn.fluginmane=function(){ 
  return this.each(function(){ 
    //code... 
  }) 
}   
 这种结构不是很理想,特别书中提到,为了防止冲突例子不使用$,而使用jQuery。在这里,我们使用匿名函数的方式实现插件的结构骨架,这样就可以防止可能的冲突。也希望大家好好了解下匿名函数相关的知识。 
 代码如下:
 
(function($){ 
  $.fn.fluginname=function(){ 
    return this.each(function(){ 
      //code... 
    }); 
  } 
})(jQuery); 
 注意点: 
  1.为了统一和规范,我们的插件文件都将以jquery.fluginname.js的形式命名(fluginname代表你插件的名字)。 
  2.我们使用到的函数都需要是私有的,不能被外部访问到,这样可保证插件不会受到外部的影响和干扰(匿名函数已经保证了这点)。 
  3.允许用户使用options控制插件的行为。 
  4.默认的options允许外部访问,这样用户就可以用最少的代码实现自定义化。 
  5.this.each()会遍历所有符合要求的对象,他本身是个jquery对象,插件最后返回该对象。其实通过这种方式就实现了javascript的链式模式。 
我们的第一个插件:txtHover 
  1.代码实现: 
 代码如下:
 
(function($){ 
  $.fn.txtHover=function(){ 
    return this.each(function(){ 
      $(this).text('text changed!'); 
    }); 
  } 
})(jQuery); 
 2.如何使用: 
  创建一个html文件,添加jquery和插件的引用,代码如下: 
 代码如下: