jquery $.fn $.fx $.extend
最近在看一些插件源码的时候发现 $.fn.XX 看的很郁闷 不知道是什么意思 就去网上找了找资料。大概了解了下。
对于$.fx 就找到这一句话 $.fx是指jquery的特效。 如果使用显示、滑动、淡入淡出、动画等。
后面再把详细的补上吧 先看 $.fn。
$.fn 其实是 jQuery提供了2个供用户扩展的‘基类’ - $.extend和$.fn.extend. 通常使用extend方法扩展 当然不用extend 也是可以的 如下代码
$.fn.alertClick = function() {
$(this).click(function() {
alert($(this).val());
});
}
$("#inputID").alertClick();
$.fn是指jquery的命名空间，加上fn上的方法及属性，会对jquery实例每一个有效。
$.extend(object); 为扩展jQuery类本身.为类添加新的方法。
$.fn.extend(object);给jQuery对象添加方法。
看到这里可能有点不好理解 jQuery 中的 类 与 对象 到底是怎么理解的。
因为在 javascript 没有明确的类的概念，但是用类来理解它，会更方便。
jQuery便是一个封装得非常好的类，而 我们用 语句 $("#btn1") 会生成一个 jQuery类的实例。 相当于实例化了一个对象 这样说 就能理解
$.extend(object); $.fn.extend(object); 了吧 哈。
jQuery.extend(object); 为jQuery类 添加类方法，可以理解为添加静态方法 ，
当我们C# 中定义一个类，其中定义有一个 静态方法的时候，就可以直接 类名.静态方法名 如下代码
1 //定义一个 $.extend 的方法 2 $.extend({ 3 add: function(a, b) { 4 return a + b; 5 } 6 }); 7 8 9 //调用 10 $(document).ready(function() { //本人习惯这样写了 11 $("#btnShow").click(function() { 12 var sum = jQuery.add(4, 5); 13 alert(sum); 14 15 }); 16 17 }); 18 19 <input value="弹出" class="but" type="button" id="btnShow" /> 20 <HTML>daima
可以看出我是直接jQuery.add(4, 5); 调用 返回接收 9 。
jQuery.fn.extend(object); 对jQuery.prototype进得扩展，就是为jQuery类添加“成员函数”。jQuery类的实例可以使用这个“成员函数”。
上面说的 jQuery是一个封装得非常好的类， $("#input1") 写法 是 jQuery类的实例。 那么 要想调用jQuery.fn.extend(object); 就要 $("#input1").alertClick(); 如下代码：
1 $.fn.extend({ 2 alertClick: function() { 3 $(this).click(function() { 4 alert($(this).val()); 5 }); 6 } 7 }); 8 9 $("#input1").alertClick();
$.jp ..//定义全局变量
$.jp = { kk: function(ks) { alert(ks); }, hash: {} }
或者
$.jp =function(ks) { alert(ks); }
都可以直接调用
$.jp.kk("123");
$.jp("123");
