jQuery.fn是什么意思？

Question

jQuery.fn是什么意思？是什么fn这里的意思？jQuery.fn.jquery

Answer 1

jQuery.fn定义为jQuery.prototype..从源代码:

jQuery.fn = jQuery.prototype = {
    // ...}

这意味着jQuery.fn.jquery的别名jQuery.prototype.jquery，它返回当前的jQuery版本。再次从源代码:

// The current version of jQuery being usedjquery: "@VERSION",

Answer 2

fn字面上指的是jQuery。prototype.

这一行代码在源代码中：

jQuery.fn = jQuery.prototype = {
 //list of functions available to the jQuery api}

但背后真正的工具fn它可以将您自己的功能连接到jQuery中。记住jQuery将是函数的父作用域，所以this将引用jQuery对象。

$.fn.myExtension = function(){
 var currentjQueryObject = this;
 //work with currentObject
 return this;//you can include this if you would like to support chaining};

这里有一个简单的例子。让我说我想做两个扩展，一个放蓝色边框，把文本涂成蓝色，然后我要把它们链接起来。

jsFiddle Demo

$.fn.blueBorder = function(){
 this.each(function(){
  $(this).css("border","solid blue 2px");
 });
 return this;};$.fn.blueText = function(){
 this.each(function(){
  $(this).css("color","blue");
 });
 return this;};

现在，您可以对这样的类使用这些：

$('.blue').blueBorder().blueText();

(我知道这是最好的CSS，例如应用不同的类名，但请记住，这只是一个演示，以显示概念)

这个答案有一个完整扩展的好例子。