'$（this）' 和 'this' 有什么区别？-解网

问：

我目前正在学习本教程：jQuery入门

对于下面的两个示例：

$("#orderedlist").find("li").each(function (i) {
    $(this).append(" BAM! " + i);
});
$("#reset").click(function () {
    $("form").each(function () {
        this.reset();
    });
});

请注意，在第一个示例中，我们用于在每个元素内附加一些文本。在第二个示例中，我们在重置表单时直接使用。$(this)lithis

$(this)似乎比 .this

我的猜测是在第一个示例中，将每个元素转换为理解函数的jQuery对象，而在第二个示例中可以直接在表单上调用。$()liappend()reset()

基本上，我们需要特殊的 jQuery 函数。$()

这是正确的吗？

javascript jquery 这个

@Jay 如果您更喜欢长输入而不是简单地使用“this”，那么是的。$（）是 jQuery 构造函数。“ 'this' 是对调用的 DOM 元素的引用。所以基本上，在$（this）中，你只是在$（）中传递this作为参数，这样你就可以调用jQuery方法和函数”。

3赞 Spencer Ruport 9/30/2017

@jay - 没有充分的理由使用，我只是用它来说明这个概念。:)不过我确实使用过。$(this)[0]$("#myDiv")[0]document.getElementById("myDiv")

0赞 Néstor Waldyd 7/15/2022

window.$(window) = $(window)

41赞 Ray Lu 6/27/2009 #2

是的，通过使用，您为对象启用了 jQuery 功能。仅通过使用，它仅具有通用的 Javascript 功能。$(this)this

92赞 Alex King 6/27/2009 #3

是的，你需要jQuery函数，但是当你想访问不使用jQuery的元素的基本javascript方法时，你可以只使用.$(this)this

371赞 Reigel Gallarde 9/15/2010 #4

$()是 jQuery 构造函数。

this是对调用的 DOM 元素的引用。

所以基本上，在中，你只是将 in 作为参数传递，以便你可以调用 jQuery 方法和函数。$(this)this$()

76赞 Fredrick Gauss 5/21/2013 #5

使用时，建议平时使用。但是，如果您知道（您应该学习并知道）区别，有时使用会更方便快捷。例如：jQuery$(this)this

$(".myCheckboxes").change(function(){ 
    if(this.checked) 
       alert("checked"); 
});

比

$(".myCheckboxes").change(function(){ 
      if($(this).is(":checked")) 
         alert("checked"); 
});

// Getting Name and modify css property of dom object through jQuery
var name = $(this).attr('name');
$(this).css('background-color','white')

// Getting form object and its data and work on..
this = document.getElementsByName("new_photo")[0]
formData = new FormData(this)

// Calling blur method on find input field with help of both as below
$(this).find('input[type=text]')[0].blur()

//Above is equivalent to
this = $(this).find('input[type=text]')[0]
this.blur()

//Find value of a text field with id "index-number"
this = document.getElementById("index-number");
this.value

or 

this = $('#index-number');
$(this).val(); // Equivalent to $('#index-number').val()
$(this).css('color','#000000')

47赞 Travis J 2/11/2015 #7

this 是元素，$（this） 是用该元素构造的 jQuery 对象

$(".class").each(function(){
 //the iterations current html element 
 //the classic JavaScript API is exposed here (such as .innerHTML and .appendChild)
 var HTMLElement = this;

 //the current HTML element is passed to the jQuery constructor
 //the jQuery API is exposed here (such as .html() and .append())
 var jQueryObject = $(this);
});

更深入的了解

此^MDN 包含在执行上下文中

作用域是指当前的执行上下文^ECMA。为了理解，理解执行上下文在 JavaScript 中的操作方式是很重要的。this

执行上下文绑定此

当控制进入执行上下文（代码在该范围内执行）时，变量的环境被设置（词法和变量环境 - 本质上，这为要输入的变量设置了一个区域，这些区域已经可以访问，以及一个用于存储局部变量的区域），并发生绑定。this

jQuery绑定了这个

执行上下文构成一个逻辑堆栈。结果是堆栈中更深层次的上下文可以访问以前的变量，但它们的绑定可能已更改。每次 jQuery 调用回调函数时，它都会使用 apply^MDN 更改 this 绑定。

callback.apply( obj[ i ] )//where obj[i] is the current element

调用的结果是，在jQuery回调函数中，这是指回调函数正在使用的当前元素。apply

例如，在中，常用的回调函数允许 .在这个范围内，是真的。.each.each(function(index,element){/*scope*/})this == element

jQuery 回调使用 apply 函数将正在调用的函数与当前元素绑定。此元素来自 jQuery 对象的元素数组。构造的每个 jQuery 对象都包含一个元素数组，这些元素与用于实例化 jQuery 对象的选择器^{jQuery API} 匹配。

$(selector)调用 jQuery 函数（请记住，这是对的引用，code：）。在内部，jQuery 函数实例化函数对象。因此，虽然它可能不是很明显，但内部使用使用 .此 jQuery 对象构造的一部分是查找选择器的所有匹配项。构造函数还将接受 html 字符串和元素。当您将其传递给 jQuery 构造函数时，您将传递要用于构造的 jQuery 对象的当前元素。然后，jQuery 对象包含与选择器匹配的 DOM 元素的数组状结构（或者在的情况下只是单个元素）。$jQuerywindow.jQuery = window.$ = jQuery;$()new jQuery()this

构造 jQuery 对象后，jQuery API 现在已公开。当调用 jQuery api 函数时，它将在内部遍历这种类似数组的结构。对于数组中的每个项目，它调用 api 的回调函数，将回调绑定到当前元素。在上面的代码片段中可以看到此调用，其中是类似数组的结构，并且是用于当前元素数组中位置的迭代器。thisobji

上一个：何时调用活动上下文或应用程序上下文？

下一个：“this”关键字如何在函数中工作？

'$（this）' 和 'this' 有什么区别？

What's the difference between '$(this)' and 'this'?

评论

评论

评论