jQuery中$(this)与this的区别
经常在写jQuery的时候分不清this 和 $(this),为了方便起见尽量不用this,只用$(this)。但是今天在别人的代码的基础上改一些东西,又遇到了这个this,不得不把它弄明白。
$(this)相当于jQuery(this),是一个jQuery对象,只能使用jQuery的属性和方法;而this中存放的是DOM元素,属于javascirpt中的DOM元素对象,要使用DOM元素对象的属性和方法。
例如下面的写法是正确的:
this.setAttribute('class','test');
如果写成下面这样,就会报错:
$(this).setAttribute('class','test');
报错说undefined,也就是所$(this)没有被定义。因为setAttribute是DOM对象的方法,而不是jQuery对象的方法。同样,反过来使用也会报错。例如:
this.attr('class','test');
因为attr是jQuery设置属性值的方法,不能用在DOM元素对象上面,因此这样写会报错。这个时候应该用$(this):
$(this).attr('class','test');
其实可以通过alert查看$(this)与this的不同,alert($(this));弹出的结果是[object Object ],alert(this);弹出来的是[object HTMLImageElement]。这里的Object指的就是jQuery对象,HTMLImageElement 指的是html元素对象。
$(this)与this的区别本质上是javascript对象与jQuery对象的区别。当然jQuery对象也可以转化为javascript对象。
$(this)[]==this;
即这种jQuery对象可以通过加下标为0方式转化成javascript对象,相当于$(this).get(0) == this;用这种get(0)的方式获取到对象的DOM对象然后就可以使用相应的DOM方法。
jQuery中$(this)与this的区别的更多相关文章
- JQuery对象与DOM对象的区别与转换
1.jQuery对象和DOM对象的区别 DOM对象,即是我们用传统的方法(javascript)获得的对象,jQuery对象即是用jQuery类库的选择器获得的对象; eg: var domObj ...
- 【jQuery】【转】jQuery中的trigger和triggerHandler区别
trigger(event, [data]) 在每一个匹配的元素上触发某类事件. 这个函数也会导致浏览器同名的默认行为的执行.比如,如果用trigger()触发一个'submit',则同样会导致浏览器 ...
- jquery中attr和prop的区别、 什么时候用 attr 什么时候用 prop (转自 芈老头 )
jquery中attr和prop的区别. 什么时候用 attr 什么时候用 prop 在高版本的jquery引入prop方法后,什么时候该用prop?什么时候用attr?它们两个之间有什么区别?这 ...
- JQuery中的html(),text(),val()区别
jQuery中.html()用为读取和修改元素的HTML标签,.text()用来读取或修改元素的纯文本内容,.val()用来读取或修改表单元素的value值. 1.HTML html():取得第一个匹 ...
- jQuery中.attr()和.prop()的区别
之前学习jQuery的时候,学习到了两种取得标签的属性值的方法:一种是elemJobj.attr(),另一种是elemJobj.prop().而在学习JS的时候,只有一种方法elemObj.getAt ...
- jquery中attr和prop的区别(转)
在网络上看到这样一篇关于jquery中attr和prop的区别文章,觉得不错,所以转载了. 在jQuery 1.6中,.attr()方法查询那些没有设置的属性,则会返回一个undefined.如果你要 ...
- Jquery中的 height(), innerHeight() outerHeight()区别
jQuery中的 height innerHeight outerHeight区别 标准浏览器下: height:高度 innerHeight:高度+补白 outerHeight:高度+补白+边框,参 ...
- JQuery之append和appendTo的区别,还有js中的appendChild用法
JQuery之append和appendTo的区别 append()前面是要选择的对象,后面是要在对象内插入的元素内容 appendTo()前面是要插入的元素内容且为Jquery对象,而后面是要选择的 ...
- jQuery学习-----(二)JQuery对象与DOM对象的区别与转换
1.jQuery对象和DOM对象的区别 DOM对象,即是我们用传统的方法(javascript)获得的对象,jQuery对象即是用jQuery类库的选择器获得的对象; eg: var domObj = ...
- 基于jquery中children()与find()的区别介绍
本篇文章介绍了,基于jquery中children()与find()的区别,需要的朋友参考下 .children(selector) 方法是返回匹配元素集合中每个元素的所有子元素(仅儿子辈).参数可选 ...
随机推荐
- 学习:简单使用MFC创建对话框窗口
MFC介绍:微软基础类库(英语:Microsoft Foundation Classes,简称MFC)是微软公司提供的一个类库(class libraries),以C++类的形式封装了Windows ...
- java 解决nginx代理的跨域访问问题
一.什么是跨域 跨域是浏览器对JavaScript同源策略的限制 二.什么情况下会产生跨域 域名不同 wwww.baidu.com www.jd.com 域名相同,访问的端口不同 wwww.baidu ...
- SuperSocket
1.目前稳定版是 v1.6: 2.轻量级.可扩展.Socket应用程序框架: 3.你可以用来开发Socket服务端应用,不用关心如何使用Socket.如何维护Socket连接和Socket如何工作. ...
- canal简单安装使用
canal简介:https://github.com/alibaba/canal 1.数据库配置 首先使用canal需要修改数据库配置 [mysqld] log-bin=mysql-bin # 开启 ...
- 同余and乘法逆元学习笔记
目录 数学符号 快速幂 方法一 方法二 同余 概念 同余的性质 乘法逆元 概念: 求逆元的方法 扩展欧几里得 快速幂法\(o(n*log(n))\) 递推法\(o(n)\) sjp大佬让我写同余那就只 ...
- 洛谷P2607题解
想要深入学习树形DP,请点击我的博客. 本题的DP模型同 P1352 没有上司的舞会.本题的难点在于如何把基环树DP转化为普通的树上DP. 考虑断边和换根.先找到其中的一个环,在上面随意取两个点, 断 ...
- linux grep 查询多行的方法
linux grep 查询多行的方法 经常查询 git log 中使用的方法, 如下 git log |grep "xxxx" 如果想查询多行的话, 就有些尴尬, 如果想查询多行的 ...
- ImportError: cannot import name 'DjangoSuitConfig'
pip3.6 install https://github.com/darklow/django-suit/tarball/v2
- 关于lct维护动态生成树问题
水管局长数据加强版 题意是要求维护一棵最小生成树,支持删边操作. 删边操作比较难处理,因为如果删掉树上的边, 很难从已经有备选集合中找出连接不同联通块的最小的边. 然而题目并没有要求在线. 所以离线. ...
- SpringMVC(十四):SpringMVC 与表单提交(post/put/delete的用法);form属性设置encrypt='mutilpart/form-data'时,如何正确配置web.xml才能以put方式提交表单
SpringMVC 与表单提交(post/put/delete的用法) 为了迎合Restful风格,提供的接口可能会包含:put.delete提交方式.在springmvc中实现表单以put.dele ...