jQuery自定义插件

来源:互联网 发布:编程英语词汇大全app 编辑:程序博客网 时间:2024/06/05 00:42

jQuery插件分为三种:
1.封装对象方法的插件(推荐)
调用在jQuery对象上的
jQuery对象.方法名();
95%以上的jQuery插件都是封装对象方法的插件

2.封装全局函数的插件

3.选择器插件

写插件的两个步骤

第一步:写出插件的模板代码,如下:

//插件的模板代码;(function($) {    //这里写插件代码})(jQuery);

第二步:封装jQuery对象方法的插件

;(function($) {    //这里写插件代码    //一.封装jQuery对象方法的插件    $.fn.extend({        "方法名": function(value) {        //这里写插件代码        }    });})(jQuery);

接下来我们封装一个Color()颜色插件

;(function($) {    //这里写插件代码    //一.封装jQuery对象方法的插件    $.fn.extend({        "color": function(value) {            //这里写插件代码            if(value == undefined) {                return this.css("color");            } else {                return this.css("color", value);            }        }    });})(jQuery);

简单的隔行变色插件

;(function ($) {    $.fn.extend({        "gehangChangeColor":function (arg,color,firstColor){            if(arg==undefined){                arg="even"            }            if(color==undefined){                color=$(this).css("background-color");            }            if(firstColor==undefined){                firstColor=color;            }else{                $(this).find("tbody tr:first").css("background-color",firstColor)            }            $(this).find("tbody tr:"+arg+"").css("background-color",color);        }    });})(jQuery);
0 0
原创粉丝点击