$(this) 和 this 关键字在 jQuery 的不同

简介: $(this) 和 this 关键字在 jQuery 的不同

在 jQuery 中,$(this)this 关键字都可以用来引用当前元素,但它们的使用场景和上下文有所不同。

  1. this: 在普通的 JavaScript 函数中,this 关键字是没有定义的。在 jQuery 中,如果你在一个函数内部使用 this,它实际上会引用到全局对象(在浏览器中通常是 window 对象)。因此,如果你在 jQuery 代码中直接使用 this,它通常不会按照你预期的方式工作。
  2. $(this): 在 jQuery 事件处理函数中,$(this) 可以用来引用触发事件的元素。例如,当一个点击事件发生时,$(this) 将引用被点击的元素。这是因为 this 在事件处理函数中默认指向触发事件的元素。通过将 this 包装在 $() 中,你可以将其转换为一个 jQuery 对象,从而可以使用 jQuery 的方法。

下面是一个简单的示例来说明这两者的区别:

// 使用 this
function myFunction() {
console.log(this); // 输出全局对象(在浏览器中是 window 对象)
}
// 使用 $(this)
$("#myButton").click(function() {
console.log($(this)); // 输出被点击的按钮的 jQuery 对象
});

在这个例子中,如果你点击 ID 为 "myButton" 的按钮,第二个示例中的 console.log($(this)) 将输出被点击的按钮的 jQuery 对象,而不是全局对象。

相关文章
|
JavaScript
jQuery 下拉菜单案例(透明+children+this)
jQuery 下拉菜单案例(透明+children+this)
68 0
|
6月前
|
JavaScript 前端开发 开发者
$(this) 和 this 关键字在 jQuery 中有何不同?
$(this) 和 this 关键字在 jQuery 中有何不同?
77 0
|
JavaScript 前端开发
|
JavaScript
JQuery this 和 $(this) 详解
this  this 在面向对象语言中,指代调用上下文对象,在js中,也是一模一样的概念,所以不管这个this出现在什么地方,只要追踪到当前调用对象是什么,那么this是什么也就一目了然了。 先看一个简单示例 (function(){ console.log("Normal function being invoked by: "+ this); })(); 输出:
1304 0
|
6月前
|
JavaScript
jQuery图片延迟加载插件jQuery.lazyload
jQuery图片延迟加载插件jQuery.lazyload
|
1月前
|
JavaScript
jQuery 树型菜单插件(Treeview)
jQuery 树型菜单插件(Treeview)
61 2