Question

我对这和$（这个）之间的区别感到困惑。调查一下，我发现this succinct explanation已经为我工作了一段时间，但后来我在this tutorial遇到了以下内容：

$.fn.greenify = function() {
    this.css( "color", "green" );
    return this;
}

本教程解释：＆＃34;请注意，要使用.css（），另一种方法，我们使用它，而不是$（this）。这是因为我们的greenify函数是与.css（）＆＃34;

相同的对象的一部分

不幸的是，我并不完全遵循。我对如何在DOM对象上使用JQuery方法而不是在DOM对象的JQuery包装器上感到困惑。任何人可能有任何解释都会非常有帮助。

澄清：我的兴趣并不是这个和$（这个）之间的区别 - 我理解前者属于JavaScript而且（粗略地说）是指全局对象，包含对象或调用DOm元素，取决于环境，而后者（再次，一般来说）指的是被JQuery包装的元素被采取行动。我对为什么this.css（）在上面的上下文中工作感兴趣。

我赞成的回复（道歉，我无法在编辑屏幕上看到被访者的姓名）很好地解决了这个问题，尽管我不愿意接受这个问题作为答案。收集更多观点。

Answer 1

jQuery插件范围内的

this是jQuery对象集合，而不是DOM节点，因此可以访问jQuery方法。

但是，您应该使用each()迭代该jQuery对象/集合，例如：

$.fn.greenify = function() {
    this.each(function(){
        this.css('color', 'green';
    });
    return this;
}

this是我们迭代的集合中元素的DOM节点，因此会导致语法错误，并且需要使用jQuery进行显式包装才能工作：

$.fn.greenify = function() {
    this.each(function(){
        $(this).css('color', 'green';
    });
    return this;
}

Answer 2

向$.fn添加函数是向jQuery原型对象添加一个函数。（那是$.fn是什么 - 每个jQuery实例对象共享的原型对象。）

当您从某些JavaScript代码调用.greenify()之类的函数时，普通的JavaScript函数调用规则就会发挥作用。与任何其他原型对象上的函数一样，this或任何其他jQuery函数的代码中.greenify()的值将是.运算符之前的表达式引用的对象。在像

这样的陈述中是什么类型的对象

$(".foo").greenify();

？它是一个jQuery对象！