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 相关文章推荐
js点击页面其它地方将某个显示的DIV隐藏
Jul 12 Javascript
用Javascript来生成ftp脚本的小例子
Jul 03 Javascript
js 判断控件获得焦点的示例代码
Mar 04 Javascript
JavaScript 开发工具webstrom使用指南
Dec 09 Javascript
JavaScript内存管理介绍
Mar 13 Javascript
js实现简单的网页换肤效果
Jan 18 Javascript
jquery实现超简单的瀑布流布局【推荐】
Mar 08 Javascript
javascript使用btoa和atob来进行Base64转码和解码
Mar 20 Javascript
TypeScript入门-接口
Mar 30 Javascript
JS检测window.open打开的窗口是否关闭
Jun 25 Javascript
vue中的非父子间的通讯问题简单的实例代码
Jul 19 Javascript
Vue.js中对css的操作(修改)具体方式详解
Oct 30 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中spl_autoload_register函数的用法总结
2013/11/07 PHP
在Laravel中使用GuzzleHttp调用第三方服务的API接口代码
2019/10/15 PHP
PhpStorm 如何优雅的调试Hyperf的方法步骤
2019/11/24 PHP
一些有用的JavaScript和jQuery的片段分享
2011/08/23 Javascript
jquery实现submit提交表单
2015/02/03 Javascript
跟我学习javascript的严格模式
2015/11/16 Javascript
JS中对象与字符串的互相转换详解
2016/05/20 Javascript
jquery根据td给相同tr下其他td赋值的实现方法
2016/10/05 Javascript
vue-router跳转页面的方法
2017/02/09 Javascript
JS获取日期的方法实例【昨天,今天,明天,前n天,后n天的日期】
2017/09/28 Javascript
Laravel整合Bootstrap 4的完整方案(推荐)
2018/01/25 Javascript
vue获取当前激活路由的方法
2018/03/17 Javascript
JS获取指定月份的天数两种实现方法
2018/06/22 Javascript
详解Vue项目中出现Loading chunk {n} failed问题的解决方法
2018/09/14 Javascript
微信小程序实现文字无限轮播效果
2018/12/28 Javascript
在Node.js中将SVG图像转换为PNG,JPEG,TIFF,WEBP和HEIF格式的方法
2019/08/22 Javascript
JS实现简单省市二级联动
2019/11/27 Javascript
详解vue-router的Import异步加载模块问题的解决方案
2020/05/13 Javascript
[01:56]《DOTA2》中文配音CG
2013/04/22 DOTA
[02:15]你好,这就是DOTA!
2015/08/05 DOTA
python encode和decode的妙用
2009/09/02 Python
python实现的文件同步服务器实例
2015/06/02 Python
python中cPickle类使用方法详解
2018/08/27 Python
python多线程案例之多任务copy文件完整实例
2019/10/29 Python
如何定义TensorFlow输入节点
2020/01/23 Python
python异常处理之try finally不报错的原因
2020/05/18 Python
纽约的奢华内衣店:Journelle
2016/07/29 全球购物
德国汉莎航空中国官网: Lufthansa中国
2017/03/30 全球购物
全球性的在线商店:Vogca
2019/05/10 全球购物
您在慕尼黑的跑步商店:Lauf-bar
2019/10/11 全球购物
超市理货员岗位职责
2014/07/04 职场文书
教师师德师风整改措施
2014/10/24 职场文书
入党介绍人意见范文
2015/06/01 职场文书
浅谈Redis主从复制以及主从复制原理
2021/05/29 Redis
K8s部署发布Golang应用程序的实现方法
2021/07/16 Golang
nginx sticky实现基于cookie负载均衡示例详解
2022/12/24 Servers