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 对象介绍
Jan 20 Javascript
JS不间断向上滚动效果代码
Dec 25 Javascript
JavaScript访问CSS属性的几种方式介绍
Jul 21 Javascript
JavaScript中的substr()方法使用详解
Jun 06 Javascript
JS实现的表格操作类详解(添加,删除,排序,上移,下移)
Dec 22 Javascript
JS、jQuery中select的用法详解
Apr 21 Javascript
js获取页面引用的css样式表中的属性值方法(推荐)
Aug 19 Javascript
jQuery鼠标移动图片上实现放大效果
Jun 25 jQuery
JsChart组件使用详解
Mar 04 Javascript
微信小程序实现单选功能
Oct 30 Javascript
面试题:react和vue的区别分析
Apr 08 Javascript
js笔试题-接收get请求参数
Jun 15 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
西德产收音机
2021/03/01 无线电
PHP中上传大体积文件时需要的设置
2006/10/09 PHP
php程序内部post数据的方法
2015/03/31 PHP
在Laravel5.6中使用Swoole的协程数据库查询
2018/06/15 PHP
PHP设计模式之迭代器模式Iterator实例分析【对象行为型】
2020/04/26 PHP
javascript实现划词标记+划词搜索功能
2007/03/06 Javascript
Javascript和HTML5利用canvas构建Web五子棋游戏实现算法
2013/07/17 Javascript
jquery checkbox 勾选的bug问题解决方案与分析
2014/11/13 Javascript
jQuery选择器源码解读(三):tokenize方法
2015/03/31 Javascript
jquery.fastLiveFilter.js实现输入自动过滤的方法
2015/08/11 Javascript
jquery事件与绑定事件
2017/03/16 Javascript
微信小程序三级联动地址选择器的实例代码
2017/07/12 Javascript
vue mixins组件复用的几种方式(小结)
2017/09/06 Javascript
jQuery实现简单日期格式化功能示例
2017/09/19 jQuery
JavaScript中为事件指定处理程序的五种方式分析
2018/07/27 Javascript
vue地址栏直接输入路由无效问题的解决
2018/11/15 Javascript
Vuex中的State使用介绍
2019/01/19 Javascript
vue项目添加多页面配置的步骤详解
2019/05/22 Javascript
小程序如何定位所在城市及发起周边搜索
2020/02/11 Javascript
搭建Python的Django框架环境并建立和运行第一个App的教程
2016/07/02 Python
详谈python中冒号与逗号的区别
2018/04/18 Python
python3+selenium实现qq邮箱登陆并发送邮件功能
2019/01/23 Python
关于Keras Dense层整理
2020/05/21 Python
Python如何将装饰器定义为类
2020/07/30 Python
详解scrapy内置中间件的顺序
2020/09/28 Python
利用css3实现的简单的鼠标悬停按钮
2014/11/04 HTML / CSS
html2 canvas生成清晰的图片实现打印功能
2019/09/23 HTML / CSS
什么是三层交换,说说和路由的区别在那里
2014/09/01 面试题
医院办公室主任职责
2013/12/29 职场文书
对祖国的寄语大全
2014/04/11 职场文书
班级旅游计划书
2014/05/03 职场文书
小学教师个人先进事迹材料
2014/05/17 职场文书
学校2014重阳节活动策划方案
2014/09/16 职场文书
2015年幼儿园大班工作总结
2015/04/25 职场文书
遗嘱范文
2015/08/07 职场文书
修改Nginx配置返回指定content-type的方法
2022/09/23 Servers