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 相关文章推荐
常用的javascript function代码
May 23 Javascript
javascript模拟的Ping效果代码 (Web Ping)
Mar 13 Javascript
如何使用Javascript获取距今n天前的日期
Jul 08 Javascript
js charAt的使用示例
Feb 18 Javascript
基于javascript实现样式清新图片轮播特效
Mar 30 Javascript
JS常用加密编码与算法实例总结
Dec 22 Javascript
VueJS事件处理器v-on的使用方法
Sep 27 Javascript
vue 不使用select实现下拉框功能(推荐)
May 17 Javascript
vue使用Google地图的实现示例代码
Dec 19 Javascript
js canvas实现橡皮擦效果
Dec 20 Javascript
浅谈layui 数据表格前后台传值的问题
Sep 12 Javascript
ant-design-vue按需加载的坑的解决
May 14 Javascript
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生成html分页列表的代码
2007/03/18 PHP
微信公众平台之快递查询功能用法实例
2015/04/14 PHP
通过PHP简单实例介绍文件上传
2015/12/16 PHP
Laravel 中使用 Vue.js 实现基于 Ajax 的表单提交错误验证操作
2017/06/30 PHP
PHP 获取 ping 时间的实现方法
2017/09/29 PHP
Laravel自动生成UUID,从建表到使用详解
2019/10/24 PHP
js获取某月的最后一天日期的简单实例
2013/06/22 Javascript
jquery 循环显示div的示例代码
2013/10/18 Javascript
JavaScript中继承用法实例分析
2015/05/16 Javascript
全面解析Bootstrap表单使用方法(表单按钮)
2015/11/24 Javascript
js实现图片上传并正常显示
2015/12/19 Javascript
原生js实现autocomplete插件
2016/04/14 Javascript
BOM系列第二篇之定时器requestAnimationFrame
2016/08/17 Javascript
AngularJS  双向数据绑定详解简单实例
2016/10/20 Javascript
js Canvas实现的日历时钟案例分享
2016/12/25 Javascript
React组件之间的通信的实例代码
2017/06/27 Javascript
在vue项目中引入highcharts图表的方法(详解)
2018/03/05 Javascript
JavaScript中变量提升与函数提升经典实例分析
2018/07/26 Javascript
vue2.0获取鼠标位置的方法
2018/09/13 Javascript
js+css3实现炫酷时钟
2020/08/18 Javascript
[03:04]DOTA2超级联赛专访ZSMJ “莫名其妙”的逆袭
2013/05/23 DOTA
python基础教程之面向对象的一些概念
2014/08/29 Python
python之cv2与图像的载入、显示和保存实例
2018/12/05 Python
Pandas读取并修改excel的示例代码
2019/02/17 Python
基于python实现高速视频传输程序
2019/05/05 Python
pyqt5 键盘监听按下enter 就登陆的实例
2019/06/25 Python
使用Keras预训练好的模型进行目标类别预测详解
2020/06/27 Python
英国第一家领先的在线处方眼镜零售商:Glasses Direct
2018/02/23 全球购物
比利时香水网上商店:NOTINO
2018/03/28 全球购物
Travelstart沙特阿拉伯:廉价航班、豪华酒店和实惠的汽车租赁优惠
2019/04/06 全球购物
医科学校毕业生自荐信
2013/11/09 职场文书
社区党务公开实施方案
2014/03/18 职场文书
学校群众路线专项整治方案
2014/10/31 职场文书
幼儿园新学期开学寄语
2015/05/27 职场文书
贷款工资证明范本
2015/06/12 职场文书
2019大学生实习报告
2019/06/21 职场文书