jQuery扩展---$.extend和$.fn.extend
博客专区 > LM_Mike 的博客 > 博客详情
jQuery扩展---$.extend和$.fn.extend
LM_Mike 发表于1年前
jQuery扩展---$.extend和$.fn.extend
  • 发表于 1年前
  • 阅读 12
  • 收藏 0
  • 点赞 0
  • 评论 0

移动开发云端新模式探索实践 >>>   

一、jQuery.extend

(function($){
	$.extend({
		static:function(){
			console.log("静态方法");
		}
	});
}(jQuery));

$(function(){
    $.static();  //console "静态方法"    
    $("#mydiv").static;  //报错
});	    

上面代码给Jquery 这个类本身添加了一个叫static的方法,被合并到了全局对象中,只与 Jquery 本身有关,与其他的 Jquery 实例对象是没有关系的。所以,这个扩展也就是所谓的静态方法。

二、jQuery.fn.extend

(function($){
	$.fn.extend({
		showId:function(){
			console.log(this.attr("id"));  //mydiv  这里this指的是调用这个方法的jQuery实例对象,本例指得是$("#mydiv");
			console.log(this instanceof jQuery);  //true
		},
		dynamic:function(){
			console.log("jQuery实例对象的");
		}
	});
}(jQuery));

$(function(){
    $("#mydiv").showId(); 
    $("#mydiv").dynamic();  //console "jQuery实例对象的"
    $.showId();  //报错
});

在jQuery源码里,jQuery.fn=jQuery.prototype,jQuery实例对象的原型赋值给jQuery.fn,所以,jQuery.fn.extend拓展的是jQuery对象(原型的)的方法啊!jQuery实例对象是啥?就是类的实例化嘛,例如 $(“#mydiv”) 。

  • 打赏
  • 点赞
  • 收藏
  • 分享
共有 人打赏支持
粉丝 1
博文 241
码字总数 39693
×
LM_Mike
如果觉得我的文章对您有用,请随意打赏。您的支持将鼓励我继续创作!
* 金额(元)
¥1 ¥5 ¥10 ¥20 其他金额
打赏人
留言
* 支付类型
微信扫码支付
打赏金额:
已支付成功
打赏金额: