$.extend() 或 jQuery.extend() 与 $.fn.Xxx 或 jQuery.fn.extend(object) 之jQuery插件开发

jQuery为开发插件提拱了两个方法

Q&A

怎样为jQuery对象设计自定义方法, 强调一点,是"jQuery对象"而非jQuery自身.请区别为jQuery设计自定义方法

语法现象1:
$.extend() 或 jQuery.extend() 或 jQuery.extend(object)
//可以理解为为jQuery类添加类方法或静态方法
【例子1.】:

//设计部分
jQuery.extend({
min: function(a, b) { return a < b ? a : b; },
max: function(a, b) { return a > b ? a : b; }
});
//调用部分,还是必须通过jQuery进行引用
jQuery.min(2,3); //  2 
jQuery.max(4,5); //  5

语法现象2:

$.extend(object, {}) = jQuery.extend(object,{})

 1 $.extend($.validator.messages, {
 2     required: "必选字段",
 3     remote: "请修正该字段",
 4     email: "请输入正确格式的电子邮件",
 5     url: "请输入合法的网址",
 6     date: "请输入合法的日期",
 7     dateISO: "请输入合法的日期 (ISO).",
 8     number: "请输入合法的数字",
 9     digits: "只能输入整数",
10     creditcard: "请输入合法的信用卡号",
11     equalTo: "请再次输入相同的值",
12     accept: "请输入拥有合法后缀名的字符串"
13 });

这代码是在研究jQuery.validation插件时,验证提示消息汉化时遇到的的,validation版本v1.15.1,把$改写成jQuery是等效的.

其中,第1行$.validator是validation插件预定义对象引用名(这点应该是通过查询validation开发API查到的吧), 当然你运行这就代码前,必须先引入jQuery.validate.js文件,至此,我非常好奇,jQuery.validate插件是怎样coding的.

区别

jQuery.fn.extend(object);

因为:jQuery.fn = jQuery.prototype

//可以理解为对jQuery.prototype进得扩展，就是为jQuery类添加“成员函数”。jQuery类的实例可以使用这个“成员函数”。

<head>
<script type="text/javascript">
$.fn.extend({          
    alertWhileClick:function() {            
          $(this).click(function(){                 
                 alert($(this).val());           
           });           
     }       
});
$(function(){
    $("#input1").alertWhileClick(); 
});
</script>
</head>
<body>
<input id="input1" type="text" value="Oman" />
</body>

等价语法

<script type="text/javascript">
$.fn.alertWhileClick = function() {            
            $(this).click(function(){                 
                alert($(this).val());           
            });           
        };
$(function(){
    $("#input1").alertWhileClick();
});
</script>

<body>
<input id="input1" type="text" value="Oman" />
</body>

参考之
《理解jquery的$.extend()、$.fn和$.fn.extend()》

jquery中的$.fn的用法