1、添加jQuery对象方法
添加jQuery对象方法:jQuery.prototype.myMethod。
在jQuery源码中有一句:jQuery.fn = jQuery.prototype,也就是给jQuery的prototype对象取了个别名,
所以 jQuery.prototype.myMethod 等价于 jQuery.fn.myMethod 等价于 $.fn.myMethod。
添加全局函数需要用新方法扩展jQuery对象——$.fn:
$.fn.myMethod = function(){}
调用:$('div').myMethod();
2、方法环境
this引用的是当前的jQuery对象。注意不是DOM对象。
$.fn.myMethod = function(){
this.hasClass(class_name);
}
这样定义置灰检查最先匹配的元素。要是有多个元素,应该用“隐式迭代”。
$.fn.myMethod = function(){
this.each(function(){
this.hasClass(class_name); // 报错
$(this).hasClass(class_name); //注意each方法内this引用的是一个DOM元素。
})
}
3、连缀
$.fn.myMethod = function(){
return this.each(function(){} // 返回jQuery对象
}
4、方法参数
4.1 简单参数
$.fn.myMethod = function(hash_obj){ // 参数通常是hash类型
return this.each(function(){}
}
$.fn.myMethod = function(opts){ // 参数通常是hash类型
var defaults = {
zIndex:10
,opacity: 0.8
}
var options = $.extend(defaults, opts); // opts 会覆盖defaults的项,defaults的值改变
return this.each(function(){}
}
$.fn.myMethod = function(opts){ // 参数通常是hash类型
var defaults = {
zIndex:10
,opacity: 0.8
,slice_offset: function(){
return { x:i, y:2*i }
}
}
var options = $.extend(defaults, opts); // opts 会覆盖defaults的项,defaults的值改变
return this.each(function(){}
}
原创文章请随便转载。愿和大家分享,并且一起进步。-- 江 coder