jQuery自定义插件

时间:2021-01-01 20:39:42

很久没接触jQuery了,陌生到连我自己都不认识自己了。刚好有人问到,那现在温习一下jQuery自定义插件:

浅谈jQuery编写插件的两种方法:

第一种:$.extend形式:

注意:

            为避免$标识符被重新定义,出现冲突,导致无法使用
            通常在匿名函数中以$作为形参,在调用时用jQuery作为实参
(function($){
    $.extend({
        Address:function(){
            console.log("噢,我渐渐的喜欢上东莞了");
        }
    });
})(jQuery);

接着在引用Address():

        function GetAddress(){
            $.Address();
        }

看console输出就是:

jQuery自定义插件

第二种: $.fn.extend形式

(function($){
    $.fn.extend({
        Job:function(){
            console.log("噢,我在搬砖");
            return this; 
        }
    });
})(jQuery);

接着调用$().Job()

    function GetJob(){
            // console.log($().Job())
            $("#job").Job().css("background","red"); 

看输出

jQuery自定义插件jQuery自定义插件

 

 就是如此,简单吧。