您的位置:首页 > Web前端 > JQuery

jQuery扩展---$.extend和$.fn.extend

2017-05-03 00:00 169 查看
一、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”) 。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: