$(this)和this的区别是什么？

Question

我有以下代码。

$('a').click(function() {
var url= this.href;
alert(url);
});

这个代码可以正常工作，确实返回了一个标签的url。

但是，如果我将上面的代码更改为

$('a').click(function() {
var url= $(this).href;
alert(url);
});

结果未定义。

有人能帮我解决这个问题吗？我为此苦恼了好久......

- Dylan Musch

---

可能是 jQuery 中的 $(this) 和 this 的重复问题。 - Matt Ball

Answer 1

$(this) 创建了一个包装了 this 的 jQuery 对象。原生 DOM 对象有一个 href 属性，但是 jQuery 没有。

$(this).attr("href") 可以起作用。

（注：保留原文HTML标签格式）

- Stefan Kendall

Answer 2

this 在您的情况下是实际的dom元素，因此锚点标记

$(this) 是一个jQuery对象，它包装了所有jQuery功能的dom元素。

所以.href不是该jQuery对象的属性，而是dom对象的属性。

您可以使用$(this).attr('href')来使用jQuery对象实现相同的效果。

- brad

Answer 3

这是因为第一个示例使用了javascript的DOMElement，而第二个示例中使用了jQuery对象。jQuery对象包装了DOMElement并提供了许多功能。您可以按以下方式访问url：

$('a').click(function() { var url= $(this).attr('href'); alert(url); });

- sled

Answer 4

很多好的答案，我只是想补充一点，你也可以这样做：

$('a').click(function(e) {
    alert($(this)[0].href);
});

- user463231

---

这并没有解释 $(this) 和 this 之间的区别。 - Felix Kling

Answer 5

DOM元素和jQuery选择器之间的区别在于什么。

在您提供的代码中，“this”是对链接的DOM元素的引用。$(this)基于仅包含该链接的DOM元素创建一个jQuery选择器。

jQuery选择器将以稍微降低性能的代价为您提供不同的功能。您的链接元素具有href属性（即可以通过this.href访问），而jQuery选择器具有所有正常的jQuery属性和方法。

要获取链接目标，this.href绝对是最简单、最快速和最不冗长的方法。

- lonesomeday