JavaScript的this 与JQuery的$(this)

ゝ一世哀愁。 2022-06-14 02:14 212阅读 0赞

JavaScript的this 与JQuery的$(this)

首先，我们先来了解一下，javascript中的this,因为在JS中，每一个function都是一个对象，所以这里var temp=this指的是function当前的对象。this是JS中的一个关键字，指的是当前的上下文对象，简单来说其实就是方法/属性的所有者。它代表的是函数运行的时候自动生成一个内部对象，只能在函数内部使用。

1）函数指向所属对象时

我们先来举个例子：student是一个对象，拥有name属性和getName方法，在getName中this其实就是指向了所属的对象student。

var student=\{

name="小红";

getName:function()\{

return this.name;

//this，就是student对象

\}

\}

student.getName();  //小红

而且在JS中，this是动态的，也就是说这个上下文对象都是可以被动态改变的。

2）函数没有所属的对象时，会指向的是全局对象

3）构造器中的this：指向新对象

在javascript中，一般是通过new关键字来调用构造函数的，但是如果我们去创建对象的时候或者数组的时候，使用的是字面量表达式创建时，是不会调用构造函数来进行创建的，一般来说，使用new关键字来构造函数的时候，此时的this会绑定在该新的对象上。

假设我们给页面中的一个元素绑定一个事件

a.addEventListener（‘click’,function()\{

//a==this

this.style.color="red";

a.style.color="red";

\},false);

//这里的false是默认值，意思是事件句柄在冒泡阶段执行

通过addEventListener绑定的事件回调中，this指向的是当前的dom对象。还有一点需要注意的是IE8以及以下的版本都是不支持addEventListener这个函数的。我们可以考虑在这些浏览器中使用attachEvent来代替这个函数。

接下来我们来看看jQuery中如何使用this，其实在jQuery中使用this更加方便，简单。

$('p').click(function()\{

$(this).css('color','red');

\});

//$(this)==$(''p'');

通过把$()方法传入当前的元素对象的引用this，把这个this加工成jQuery对象，然后我们就可以使用jQuery提供的方法进行处理。

小结：

this,表示的是当前上下文对象是一个html对象，可以调用html对象所拥有的属性和方法。

$(this),代表的上下文对象是一个jQuery的上下文对象，可以调用jQuery的方法和属性。

发表评论取消回复

表情：

评论列表（有 0 条评论，212人围观）

还没有评论，来说两句吧...

相关阅读

相关 JavaScript的this 与JQuery的$(this)

JavaScript的this 与JQuery的$(this) 首先，我们先来了解一下，javascript中的this,因为在JS中，每一个function

ゝ一世哀愁。/ 2022年06月14日 02:14/ 0 赞/ 213 阅读

相关 Jquery中$(this)与this的区别

相信很多刚接触JQuery的人，很多都会对$(this)和this的区别模糊不清，那么这两者有什么区别呢？　　首先来看看JQuery中的 $() 这个符号，实际上这个符

灰太狼/ 2022年06月12日 07:27/ 0 赞/ 231 阅读

相关 JavaScript中的this

this的指向在函数定义的时候是确定不了的，只有函数执行的时候才能确定this到底指向谁，实际上this的最终指向的是那个调用它的对象 1. function fn

r囧r小猫/ 2022年05月20日 07:04/ 0 赞/ 263 阅读

相关 this与$(this)的区别

this指的是HTM中的元素 $(this)指的是JQuery的处理对象 $("textbox").hover( function() {

ゝ一世哀愁。/ 2022年05月20日 06:04/ 0 赞/ 200 阅读

相关 JavaScript 的 this 原理

一、问题的由来学懂 JavaScript 语言，一个标志就是理解下面两种写法，可能有不一样的结果。 var obj = { foo: functi

小咪咪/ 2022年05月19日 09:37/ 0 赞/ 184 阅读

相关 JavaScript中的this

this（上下文对象） \- 我们每次调用函数时，解析器都会将一个上下文对象作为隐含的参数传递进函数。使用this来引用上下文对象，根据函数的调用形式不同，this的

短命女/ 2022年05月18日 04:24/ 0 赞/ 273 阅读

相关 JavaScript中的this

> 小编推荐：[Fundebug][]专注于JavaScript、微信小程序、微信小游戏，Node.js和Java实时BUG监控。真的是一个很好用的bug监控费服务，众多大佬公

待我称王封你为后i/ 2022年04月10日 02:59/ 0 赞/ 297 阅读

相关 JavaScript 中的 this

[为什么80%的码农都做不了架构师？>>> ][80_] ![hot3.png][] [查][Link 1][看原文][Link 2] Yehuda Katz 强调了函数调

刺骨的言语ヽ痛彻心扉/ 2022年01月17日 12:06/ 0 赞/ 294 阅读

相关 jQuery中this与$(this)的区别

$()的作用： 1.传入一个选择器字符串，获取选择器对应的DOM的内容,保存在数组中，也就是所说的jquery对象。例如：\`$('.class') 、$('\id‘)、

深藏阁楼爱情的钟/ 2021年12月11日 09:53/ 0 赞/ 289 阅读

相关 jQuery中this与$(this)的使用与区别

this与$(this)的区别 this其实是一个Html 元素，是一个javascript对象，常用其来为其属性赋值。 $(this)是一个jQuery对象，不存在

Myth丶恋晨/ 2021年12月11日 09:05/ 0 赞/ 322 阅读