jquery中$(this)和this的区别

Posted 2023-02-18

技术标签:

【中文标题】jquery中$(this)和this的区别【英文标题】：Difference between $(this) and this in jquery 【发布时间】：2011-04-07 16:34:45 【问题描述】：

使用 $(this) 与 this 的根本区别是什么

$('.viewComments').click(function(ev)
    //returns the desired value
    alert(this.getAttribute('id'));

    //Gives an error sayin function is not defined 
    alert($(this).getAttribute('id'));

    //returns the desired value
    alert($(this).attr('id'));
);

我认为“$(this)”将包含“this”具有的所有功能以及更多功能。但似乎并非如此。

那么 $(this) 到底是什么？和

我在使用时如何知道有哪些功能可用？（我知道我可以通过 firebug 获取它们。但我想知道是否有其他方法 - 可能是某些文档）

【问题讨论】：

Why do I have to use $(this)的可能重复 【参考方案1】：

this 是 DOM 对象，而 $(this) 是相同的 jQuery 包装器。

当使用this时，你可以在上面调用DOM方法，但不能调用jQuery方法。使用$(this)时，可以调用jQuery方法，但不能调用DOM方法。

【讨论】：

那么在我的 jquery 代码中使用 $(this) 是更有利还是最佳实践？ @Sheldon：当然。您希望能够使用所有多汁的 jQuery 优点，不是吗？ :-) 如果是这样，我怎样才能只使用一个'this'来获取DOM方法和jQuery方法？ @AldiUnanto 你为什么想做这样的事情？您永远不想将两者混为一谈。 @AldiUnanto 可维护的编码不是golfing。 :-) 如果您希望代码保持可维护性，您真的不应该将两者混为一谈。但如果你真的坚持，你可以使用一些猴子修补技巧。你没有从我这里听到。【参考方案2】：

$(this) - 表示当前 DOM 元素在哪个事件上调用此函数

this 关键字 - 在 javascript 中，this 总是指我们正在执行的函数的“所有者”，或者更确切地说，指的是函数作为方法的对象。

【讨论】：

请注意$(this) 表示包装为jQuery 对象的DOM 元素因为而when this 指的是DOM 元素作为原生 DOM API 对象【参考方案3】：

在 jQuery 中，this 指的是 DOM 对象，$(this) 指的是同一个对象，但添加了 jQuery 方法

你不能调用this.each()，因为每个都不是 DOM 方法，它是一个 jquery 方法

你可以调用$(this).each()，因为$(this)返回一个jquery对象

【讨论】：

【参考方案4】：

$(this) 是使用 jQuery 选择器或附加到对象的事件选择的当前对象。

所以如果您有$('#myelement').click(.....，那么$(this) 指的是被点击的元素，因此$(this).hide() 会隐藏该元素。

【讨论】：