在目前流行的web程序开发和设计中,jquery一定是必不可少的,无论你是在百度,还是淘宝,你都能找到它,为了代码或者方法的重用,往往我们会根据功能自己去封装或者是扩展jquery,也就是jquery插件的开发。
Jquery的插件有三种类型。
1.封装对象方法的插件:
这种插件是将对象方法进行封装起来,可以通过选择器来获取对象的操作,如下面的一个对jquery的color()插件,该插件通过选择器来设置匹配元素的颜色,这就是对jquery对象的方法扩展,写法如下(也是标准的写法).
;(function($){ $.fn.extend({ //属性 "color":function(value){ if(value==undefined){ return this.css("color");//返回元素的颜色 } return this.css("color",value);//设置元素的颜色 } }); })(jQuery);
插件的使用方法,比如我们要获取div下面第一个元素字体的颜色,并且把div下面的字体全部设置为红色。
$("div").color();//返回一个颜色字符串 $("div").color("red");//把字体设置为红色
2.封装全局函数的插件
在jquery空间内容增加一个自定义函数
如增加一个使用jquery去除字符串右边或者是左边空格的函数,jquery已经有去除字符串两边空格的函数,写法如下,也是标准的写法:
;(function($){ $.extend(function(){ ltrim:function(text){ return (text|| "").replace(/^\s+/g,""); }, rtrim:function(text){ return (text|| "").replace(/\s+$/g,""); } }); })(jQuery);
调用方式:jQuery.ltrim(" sss");
jQuery.rtrim("sss ");