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 struts 验证唯一标识(公用方法)
Mar 27 Javascript
简约JS日历控件 实例代码
Jul 12 Javascript
js操作输入框提示信息且响应鼠标事件
Mar 25 Javascript
JS函数this的用法实例分析
Feb 05 Javascript
angular.js分页代码的实例
Jul 27 Javascript
Javascript中浏览器窗口的基本操作总结
Aug 18 Javascript
BootStrap下拉框在firefox浏览器界面不友好的解决方案
Aug 18 Javascript
详解vue事件对象、冒泡、阻止默认行为
Mar 20 Javascript
JS设置随机出现2个数字的实例代码
Jul 19 Javascript
jquery之基本选择器practice(实例讲解)
Sep 30 jQuery
swiper在vue项目中loop循环轮播失效的解决方法
Sep 15 Javascript
vue实现微信获取用户信息的方法
Mar 21 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
人族 TERRAN 概述
2020/03/14 星际争霸
咖啡产品发展的三大浪潮
2021/03/04 咖啡文化
解决文件名解压后乱码的问题 将文件名进行转码的代码
2012/01/10 PHP
php ci框架验证码实例分析
2013/06/26 PHP
php生成静态页面的简单示例
2014/04/17 PHP
2014年10个最佳的PHP图像操作库
2014/07/14 PHP
从零开始学YII2框架(五)快速生成代码工具 Gii 的使用
2014/08/20 PHP
php array_slice 取出数组中的一段序列实例
2016/11/04 PHP
php json_encode与json_decode详解及实例
2016/12/13 PHP
PHP的反射机制实例详解
2017/03/29 PHP
获取dom元素那些讨厌的位置封装代码
2010/06/23 Javascript
jquery异步请求实例代码
2011/06/21 Javascript
利用JQuery和JS实现奇偶行背景颜色自定义效果
2012/11/19 Javascript
jQuery图片轮播的具体实现
2013/09/11 Javascript
JS,Jquery获取select,dropdownlist,checkbox下拉列表框的值(示例代码)
2014/01/11 Javascript
深入理解JavaScript系列(25):设计模式之单例模式详解
2015/03/03 Javascript
webpack源码之loader机制详解
2018/04/06 Javascript
基于nodejs res.end和res.send的区别
2018/05/14 NodeJs
jQuery实现表单动态加减、ajax表单提交功能
2018/06/08 jQuery
Vue动态获取width的方法
2018/08/22 Javascript
Vue中消息横向滚动时setInterval清不掉的问题及解决方法
2019/08/23 Javascript
通过javascript实现扫雷游戏代码实例
2020/02/09 Javascript
Vue3配置axios跨域实现过程解析
2020/11/25 Vue.js
[01:45]绝对公平!DOTA2队长征召模式详解
2014/04/25 DOTA
python+opencv识别图片中的圆形
2020/03/25 Python
Python键鼠操作自动化库PyAutoGUI简介(小结)
2020/05/17 Python
日本最新流行服饰网购:Nissen
2016/07/24 全球购物
Lenox官网:精美的瓷器&独特的礼品
2017/02/12 全球购物
俄罗斯小米家用电器、电子产品和智能家居商店:Poood.ru
2020/04/03 全球购物
化工专业推荐信范文
2013/11/28 职场文书
保密工作实施方案
2014/02/24 职场文书
小学德育工作经验交流材料
2014/05/22 职场文书
小学生学习保证书
2015/02/26 职场文书
2015年光棍节活动总结
2015/03/24 职场文书
2015年学校德育工作总结
2015/04/22 职场文书
pandas进行数据输入和输出的方法详解
2022/03/23 Python