JQuery this 和 $(this) 的区别


Posted in Javascript onAugust 23, 2009

What is "this"?
In many object-oriented programming languages, this (or self) is a keyword which can be used in instance methods to refer to the object on which the currently executing method has been invoked.

$("#textbox").hover( 
function() { 
this.title = "Test"; 
}, 
fucntion() { 
this.title = "OK”; 
} 
);

这里的this其实是一个Html 元素(textbox),textbox有text属性,所以这样写是完全没有什么问题的。
但是如果将this换成$(this)就不是那回事了,Error?报了。
Error Code:
$("#textbox").hover( 
function() { 
$(this).title = "Test"; 
}, 
function() { 
$(this).title = "OK"; 
} 
);

这里的$(this)是一个JQuery对象,而jQuery对象?]有title 属性,因此这样写是错误的。

JQuery拥有attr()方法可以get/set DOM对象的属性,所以正确的写法应该是这样:

正确的代码:

$("#textbox").hover( 
function() { 
$(this).attr('title', ‘Test'); 
}, 
function() { 
$(this).attr('title', ‘OK'); 
} 
);

使用JQuery的好处是它包?了各种浏览器版本对DOM对象的操作,因此统一使用$(this)而不再用this应该是比较不错的选择。
Javascript 相关文章推荐
基于jquery的direction图片渐变动画效果
May 24 Javascript
JS中for循序中延迟加载动态效果的具体实现
Aug 18 Javascript
jquery实现图片滚动效果的简单实例
Nov 23 Javascript
JQuery判断radio是否选中并获取选中值的示例代码
Oct 17 Javascript
基于jquery实现放大镜效果
Aug 17 Javascript
Angular实现搜索框及价格上下限功能
Jan 19 Javascript
vue判断input输入内容全是空格的方法
Mar 02 Javascript
vue实现通讯录功能
Jul 14 Javascript
微信小程序实现抖音播放效果的实例代码
Apr 11 Javascript
基于javascript原生判断DOM是否加载完毕
Oct 14 Javascript
vue elementUI批量上传文件
Apr 26 Vue.js
Vue操作Storage本地化存储
Apr 29 Vue.js
ext checkboxgroup 回填数据解决
Aug 21 #Javascript
获取HTML DOM节点元素的方法的总结
Aug 21 #Javascript
自己的js工具 Event封装
Aug 21 #Javascript
自己的js工具 Cookie 封装
Aug 21 #Javascript
自己的js工具_Form 封装
Aug 21 #Javascript
javascript 面向对象编程基础 多态
Aug 21 #Javascript
javascript 面向对象编程基础:继承
Aug 21 #Javascript
You might like
PHP读取配置文件类实例(可读取ini,yaml,xml等)
2015/07/28 PHP
Yii2 hasOne(), hasMany() 实现三表关联的方法(两种)
2017/02/15 PHP
php探针使用原理和技巧讲解
2019/09/17 PHP
Gird组件 Part-3:范例RSSFeed Viewer
2007/03/10 Javascript
javascript 类定义的4种方法
2009/09/12 Javascript
JS面向对象编程详解
2016/03/06 Javascript
Angular2从搭建环境到开发步骤详解
2016/10/17 Javascript
JS获取填报扩展单元格控件的值的解决办法
2017/07/14 Javascript
说说AngularJS中的$parse和$eval的用法
2017/09/14 Javascript
Angular中的$watch方法详解
2017/09/18 Javascript
javascript基于牛顿迭代法实现求浮点数的平方根【递归原理】
2017/09/28 Javascript
详解vue2.0 不同屏幕适配及px与rem转换问题
2018/02/23 Javascript
JS获取input[file]的值并显示在页面的实现方法
2018/03/09 Javascript
[01:56]生活中的妖精之七夕特别档
2016/08/09 DOTA
Python高级应用实例对比:高效计算大文件中的最长行的长度
2014/06/08 Python
Python中字典(dict)合并的四种方法总结
2017/08/10 Python
简单学习Python多进程Multiprocessing
2017/08/29 Python
Python编程pygame模块实现移动的小车示例代码
2018/01/03 Python
pandas表连接 索引上的合并方法
2018/06/08 Python
python中时间模块的基本使用教程
2019/05/14 Python
python django生成迁移文件的实例
2019/08/31 Python
Pytorch之卷积层的使用详解
2019/12/31 Python
皮尔·卡丹巴西官方商店:Pierre Cardin
2017/07/21 全球购物
世界领先的高品质定制产品平台:Zazzle
2017/07/23 全球购物
维多利亚的秘密官方网站:Victoria’s Secret
2018/10/24 全球购物
几道PHP的面试题
2012/05/19 面试题
不用游标的SQL语句有哪些
2012/09/07 面试题
中专毕业自我鉴定
2013/10/16 职场文书
毕业生求职的求职信
2013/12/05 职场文书
气象学专业个人求职信
2014/03/15 职场文书
教师新年寄语
2014/04/03 职场文书
房屋转让协议书
2014/04/11 职场文书
优秀护士先进事迹
2014/05/08 职场文书
企业2014年度工作总结
2014/12/10 职场文书
100句拼搏进取的名言警句,值得一读!
2019/10/07 职场文书
goland 清除所有的默认设置操作
2021/04/28 Golang