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) 方法是返回匹配元素集合中每个元素的所有子元素(仅儿子辈).参数可选 ...
随机推荐
- (13)使用python+flask实现树莓派的WEB控制
https://blog.csdn.net/qq_34803821/article/details/86240096 如果你想在网页上点击按钮,并且让树莓派接收到响应,并做响应的处理,实现网页上与树莓 ...
- micronaut 学习一 基本安装
一般来说,使用框架就是使用类库同时按照框架的类库套路编写代码,但是从越来越复杂的实际 场景来说,cli以及脚手架工具,可以帮助我们简化好多操作. 以下是micronaut cli 工具的安装以及一个简 ...
- [RN] React Native 再按一次退出
实现 React Native 再按一次退出 单页面: ... componentWillMount() { BackHandler.addEventListener('hardwareBackPre ...
- Noip2018/Csp2019 ------退役记
退役记 上记 不知道为啥,自从今下午某大佬的人生第一次政治运动(虽然最后被镇压,现在小命难保)后,仿佛有一种看破感. 以下有点在自作多情,不喜者可以不看. 学信竞快一年了.可以说有收获也有失去吧. 收 ...
- SpringCloud:搭建基于Gateway的微服务网关(二)
0.代码 https://github.com/fengdaizang/OpenAPI 1.引入相关依赖 pom文件如下: <?xml version="1.0" encod ...
- Mongoose 数据校验
什么是mongoose数据校验 用户通过mongoose给mongodb数据库增加数据的时候,对数据的合法性进行的验证 mongoose里面定义Schema:字段类型,修饰符.默认参数 .数据校验都是 ...
- maven 左边空了
看一下maven: 解决方法:进入maven的配置,把maven的路径配置一下,就好了: 结果:
- qt5 源码编译
源码 qt-everywhere-src-5.11.3 依赖 apt-get install bison build-essential gperf flex ruby python libasoun ...
- RPGMaker MV 入门教程
RPG Maker是一个十分优秀的rpg游戏制作引擎 恩 一个被定义为游戏的游戏引擎 可以用来十分便捷的制作rpg游戏 有兴趣的可以尝试一下 满足自己想做游戏的愿望. Step1 决定你的RPG形 ...
- SELECT DISTINCT ON expressions must match initial ORDER BY expressions
开发说pg中执行sql报错,发来消息让帮看看: SELECT DISTINCT ON expressions must match initial ORDER BY expressions 详细语句如 ...