jQuery插件开发$.extend和$.fn.extend插件机制
2017-01-04 13:15:32  By: shinyuu

• shinyuu
• JQuery教程
• 0
• 4252
• 1

 jQuery插件开发分为两种、一个是类级别、一个是对象级别、今天就针对这两种方式给大家做一个Demo、加深自己的理解的同事也希望对大家有帮助

 

1 类级别

类级别你可以理解为拓展jquery类、最明显的例子是$.ajax(...),相当于静态方法、开发扩展其方法时使用$.extend方法、即jQuery.extend(object); 

$.extend({ 
    add:function(a,b){return a b;} ,
    minus:function(a,b){return a-b;} 
}); 

页面中调用

var i = $.add(3,2);
var j = $.minus(3,2);

2 对象级别

对象级别则可以理解为基于对象的拓展、如$("#table").changeColor(...); 这里这个changeColor呢、就是基于对象的拓展了、开发扩展其方法时使用$.fn.extend方法、即jQuery.fn.extend(object); 

$.fn.extend({
    check:function(){
        return this.each({
            this.checked=true;
        });
    },
    uncheck:function(){
        return this.each({
            this.checked=false;
        });
    }
});

页面中调用

$(´input[type=checkbox]´).check();
$(´input[type=checkbox]´).uncheck();

 

3、扩展

$.xy = {
    add:function(a,b){return a b;} ,
    minus:function(a,b){return a-b;},
    voidMethod:function(){ alert("void"); }
};

var i = $.xy.add(3,2);
var m = $.xy.minus(3,2);

$.xy.voidMethod();

若资源对你有帮助、浏览后有很大收获、不妨小额打赏我一下、你的鼓励是维持我不断写博客最大动力

想获取DD博客最新代码、你可以扫描下方的二维码、关注DD博客微信公众号（ddblogs）

或者你也可以关注我的新浪微博、了解DD博客的最新动态：DD博客官方微博（dwtedx的微博）

如对资源有任何疑问或觉得仍然有很大的改善空间、可以对该博文进行评论、希望不吝赐教

为保证及时回复、可以使用博客留言板给我留言: DD博客留言板（dwtedx的留言板）

感谢你的访问、祝你生活愉快、工作顺心、欢迎常来逛逛