手机浏览 RSS 2.0 订阅 膘叔的简单人生 , 腾讯云RDS购买 | 超便宜的Vultr , 注册 | 登陆

JQuery — this 和 $(this) 的区别

首页 > Javascript >

在美拓的BLOG【http://meito.22web.net/?p=51】上面看到这篇文章,先说说我的理解吧。

jQuery的代码中,this是代表了当前对象。例如:$("#test").click(function(){ alert(this.value )});,在这个方法里,如果用了this,那就是相当于直接使用了 test 元素这个对象,有点象document.getElementById("#test")一样【说的我自己都迷糊了。。。】在这个方法中的this,就是ID为test的元素本身

而$(this),则是把这个元素对象重新进行了 jQuery的包装。。。

说的太乱了。。。。直接看美拓的原文吧。

-------原文开始-------------

起初以为this和$(this)就是一模子刻出来。但是我在阅读时,和coding时发现,总不是一回事。
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.

JavaScript代码
  1. $("#textbox").hover(  
  2.       function() {  
  3.            this.title = "Test";  
  4.       },  
  5.       fucntion() {  
  6.           this.title = "OK”;  
  7.       }  
  8. );  

 

这里的this其实是一个Html 元素(textbox),textbox有text属性,所以这样写是完全没有什么问题的。
但是如果将this换成$(this)就不是那回事了,Error–报了。

Error Code:

JavaScript代码
  1. $("#textbox").hover(  
  2.        function() {  
  3.           $(this).title = "Test";  
  4.        },  
  5.        function() {  
  6.           $(this).title = "OK";  
  7.        }  
  8. );  

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

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

正确的代码:

JavaScript代码
  1. $("#textbox").hover(  
  2.       function() {  
  3.          $(this).attr(’title’, ‘Test’);  
  4.       },  
  5.       function() {  
  6.          $(this).attr(’title’, ‘OK’);  
  7.       }  
  8. );  
使用JQuery的好处是它包裝了各种浏览器版本对DOM对象的操作,因此统一使用$(this)而不再用this应该是比较不错的选择。

---EOF---

看来还是不行啊我。。语言组织能力太差

 

 




本站采用创作共享版权协议, 要求署名、非商业和保持一致. 本站欢迎任何非商业应用的转载, 但须注明出自"易栈网-膘叔", 保留原始链接, 此外还必须标注原文标题和链接.

Tags: jquery

« 上一篇 | 下一篇 »

只显示10条记录相关文章

JQuery -- this 和 $(this) 的区别 (浏览: 86432, 评论: 3)
[转载]超强大的jquery formValidator (浏览: 51819, 评论: 3)
jQuery插件---获取URL参数 (浏览: 47119, 评论: 1)
jQuery的html()等方法介绍 (浏览: 46535, 评论: 1)
取得html中的comment的内容 (浏览: 43358, 评论: 2)
jQuery的bind函数 (浏览: 41654, 评论: 1)
将Yiiframework与JQuery easyUI整合使用 (浏览: 39091, 评论: 2)
jQuery一些插件的链接[转] (浏览: 38656, 评论: 2)
取消radio的选中状态 (浏览: 37814, 评论: 1)
JQuery学习第一天 (浏览: 36353, 评论: 3)

2条记录访客评论

是呀。是你博客的。我保留了你的博客链接。。。俺一向如此老实的

Post by gouki on 2009, October 16, 9:55 PM 引用此文发表评论 #1

我博客的,我也是转载的

Post by 独孤逸辰 on 2009, October 15, 9:42 PM 引用此文发表评论 #2


发表评论

评论内容 (必填):