jQuery中的$.fx与$.fn

版权声明:wuyujin1997 reserve all rights. https://blog.csdn.net/wuyujin1997/article/details/89017466

$.fx

$.fx是jQuery的特效。
如果使用显示,滑动,淡入淡出,动画等,可以用$.fx.stop停止动画。

$.fn

$.fn是jQuery的方法的命名空间function namespace
添加到$.fn上的成员,会对用$(selector)宣导的每一个jQuery实例有效(可调用)。

通常使用两个方法进行编写jQuery插件|jQuery扩展
jQuery.extend(obj) 相当于扩展类层次的静态成员。
Merge the contents of an object onto the jQuery prototype to provide new jQuery instance methods.
将对象的内容合并到jQuery原型上,以提供新的jQuery实例方法。

jQuery.fn.extend(target, obj1, ..., objN) 扩展对象层次的实例成员。
Merge the contents of two or more objects together into the first object.
将两个或多个对象的内容合并到第一个目标对象中。

查看源码可知:$.fn就是jQuery的原型$.prototype
所以向$.fn添加成员就是向jQuery对象添加可调用的成员。

jQuery.fn = jQuery.prototype = {
	constructor: jQuery,
	init: ...
}

code

  • $.extend(object)
$.asdfg
undefined
$.extend({asdfg: function() {console.log("类层次的静态方法");}});
ƒ (e,t){return new b.fn.init(e,t,r)}
$.asdfg()
类层次的静态方法
  • $.fn.extend(target, obj1, ..., objN)
$("p:first").instancehhh
undefined
$.fn.instancehhh = function() {console.log("对象层次的方法 - prototype");};
ƒ () {console.log("对象层次的方法 - prototype");}
$("p:first").instancehhh()
对象层次的方法 - prototype

在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/wuyujin1997/article/details/89017466
FX