jquery.fn.extend与jquery.extend的用法以及区别

时间 2019-12-09

标签 jquery.fn.extend jquery extend jquery.extend 用法以及区别栏目 JQuery 繁體版

原文原文链接

概念：html

jQuery.extend(object)——为扩展jQuery类自己.为类添加新的方法。jquery

jQuery.fn.extend(object)——给jQuery对象添加方法。函数

直接下代码:this

(jquery.fn.extend)prototype

<body>
    <input id="input1" type="text"/>
</body>
    <script>
            //自定义方法 jQuery.fn.extend(object);
            // 对jQuery.prototype进得扩展，就是为jQuery类添加“成员函数”
            $.fn.extend({
                alterWhileClick1: function () {
                    $(this).click(function () {
                        alert($(this).val());
                    });
                }
            });
    //或者以下自定义也能够
    $.fn.alterWhileClick2 = function () {
        $(this).click(function () {
            alert($(this).val());
        });
    }
    //直接引用该方法
    $("#input1").alterWhileClick1();
 </script>

再看(jquery.extend)htm

<body>
    <input id="input1" type="text"/>
</body>
<script>
    //或者
    $.extend({
        alterWhileClick3: function (a,b) {
//            $(this).click(function () {
//                alert($(this).val());
//                return false;
//            });
            return a+b;
        }
    });
    //引用方法并赋值
    var a = $.alterWhileClick3(3,4);
    $("#input1").val("答案是:"+a);
</script>

区别：jQuery.extend是return返回结果，而jQuery.fn.extend无返回值，但能够在该函数里定义事件。对象

拓展相关知识(自定义方法): blog

//自定义方法加载前缀名  （好处:能够封装成自家公司的，以公司的前缀为主）如:myMethod.js
window.myMethod = window.myMethod || {};
//定义error方法名
myMethod.error=function(){
   //alert("哎呀,加载出错了"); 
   return "哎呀,加载出错了";
}
//引用方法无返回值
//myMethod.error();
//引用方法有返回值
 var a = myMethod.error();
}

注：本篇仅简洁讲述二者的用法与区别，想更深一步了解的请参照该博文http://www.cnblogs.com/wyjgreat/archive/2011/07/19/2110754.html事件