zoukankan      html  css  js  c++  java
  • $.fn.extend 与 $.extend的区别

    今天看到别人写的jquery 代码都是这样的 $.fn.extend 所以查询了一下,因为自己不是前端开发,看到这样写的,感觉很牛逼。
    从百度上搜到的感觉解释的还是挺好的,作为记录,方便以后查找。

    搜索到内容:
    我们先把jQuery看成了一个类,这样好理解一些。
    jQuery.extend(),是扩展的jQuery这个类。
    假设我们把jQuery这个类看成是人类,能吃饭能喝水能跑能跳,现在我们用jQuery.extend这个方法给这个类拓展一个能唱歌的技能。这样的话,不论是男人,女人,xx人.....等能继承这个技能(方法)了。

    jQuery.extend({
    alertmsg1: function () {
    alert('ttt');
    }
    });

    然后:   $.alertmsg1(); 就可以调用

    这说明啥啊,这说明.liu()变成了jQuery这个类本身的方法(object)嘛。他现在能”唱歌“了。

    但是吧,这个能力啊,只有代表全人类的 jQuery 这个类本身,才能用啊。你个人想用,你张三李四王五麻六,你个小草民能代表全人类嘛?

    所以啊,这个扩展也就是所谓的静态方法。只跟这个 类 本身有关。跟你具体的实例化对象是没关系滴。

    我们再看看jQuery.fn.extend()这个方法。

    从字面理解嘛,这个拓展的是jQuery.fn的方法。

    jQuery.fn是啥玩意呢?

    jQuery.fn.extend拓展的是jQuery对象(原型的)的方法啊!

    对象是啥?就是类的实例化嘛,例如

    $("#abc") 

     这个玩意就是一个实例化的jQuery对象嘛。

    那就是说,jQuery.fn.extend拓展的方法,你得用在jQuery对象上面才行啊!他得是张三李四王五痳六这些实例化的对象才能用啊。

    说白了就是得这么用(假设xyz()是拓展的方法):

    $('selector').xyz();

     你要是这么用$.xyz();是会出错误滴。

    jQuery.fn.extend({
        alertmsg2: function () {
            alert('ttt');
        }
    });

       调用就要用到实例的这种$("#btn").alertmsg2();

    说的简单点就是 $.extend 是对jquery这个类的扩展,$.fn.extend是对类的对象的扩展

     var defaults = {
                background: "#888",
                borderColor: "#000",
                foreColor: "#000",
                height: "50px",
                fontSize: "20px",
                close: "click"
            };
            var options = $.extend(defaults, option);

    还有就是$.extend(defaults, option);

     以jQuery.extend(objA, objB)為例,你可以想像成objA与objB各有一些属性(方法也会比照处理,在此只提属性),extend()会將objB有而objA沒有的属性加到objA里,如果objB里的某個属性,objA里刚好也有同名的属性,则会用objB的属性值去覆盖objA原有的属性。objA最後就是整合結果,或者也可以由var objC = jQuery.extend(objA, objB)取得整合結果(objA == objC)。

    如果有jQuery.extend(objA, objB,objC)  如果有相同的属性,则会以objC的属性为准

  • 相关阅读:
    time 模块学习
    day 14 自定义模块,常用模块 time .datetime ,time 模块
    day 13 课后作业
    day 12 课后作业
    day 11课后作业
    树状数组最值
    hdu 1059 Dividing bitset 多重背包
    XVII Open Cup named after E.V. Pankratiev. XXI Ural Championship
    最长公共子序列板/滚动 N^2
    Uva 10635
  • 原文地址:https://www.cnblogs.com/elsons/p/7278464.html
Copyright © 2011-2022 走看看