<h1 class="postTitle" >JQuery -- this 和 $(this) 的区别</h1>
<div class="clear" ></div>
<div class="postBody" >
<div id="cnblogs_post_body">
<p><span >起初以为this和$(this)就是一模子刻出来。但是我在阅读时，和coding时发现,总不是一回事。</span></p>
<h4>What is "this"?</h4>
<blockquote>
<p><span >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.</span></p>
</blockquote>
<p></p>
<p><span >$(</span><span >"</span><span >#textbox</span><span >"</span><span >).hover(<br />
<span class="Apple-converted-space"></span></span><span >function</span><span >(){<br />
<span class="Apple-converted-space"></span></span><span >this</span><span >.title</span><span >=</span><span ></span><span >"</span><span >Test</span><span >"</span><span >;</span><br />
<span > },<br />
<span class="Apple-converted-space"></span></span><span >fucntion</span><span >(){<br />
<span class="Apple-converted-space"></span></span><span >this</span><span >.title</span><span >=</span><span ></span><span >"</span><span >OK”;</span><br />
<span ></span><span > }</span><br />
<span >);</span><br />
<br />
<span >这里的this其实是一个Html 元素(textbox)，textbox有text属性，所以这样写是完全没有什么问题的。</span><br />
<span >但是如果将this换成$(this)就不是那回事</span>了，Error--报了。</p>
<blockquote>
<p>Error Code：<span class="Apple-converted-space"></span><br />
<span >$("#textbox").hover(<span class="Apple-converted-space"></span></span><br />
<span class="Apple-converted-space"></span><span >function</span><span >() {<span class="Apple-converted-space"></span></span><br />
<span > $(this).title ＝ "Test";<span class="Apple-converted-space"></span></span><br />
<span > },<span class="Apple-converted-space"></span></span><br />
<span class="Apple-converted-space"></span><span >function</span><span >() {<span class="Apple-converted-space"></span></span><br />
<span > $(this).title = "OK";<span class="Apple-converted-space"></span></span><br />
<span > }<span class="Apple-converted-space"></span></span><br />
<span >);</span></p>
</blockquote>
<p><span >这里的</span><strong >$</strong>(this)是一个JQuery对象，而jQuery对象?有title 属性，因此这样写是错误的。</p>
<p><span >JQuery拥有attr()方法可以get/set DOM对象的属性，所以正确的写法应该是这样：</span></p>
<blockquote>
<p>正确的代码：<span class="Apple-converted-space"></span><br />
<span >$("#textbox").hover(<span class="Apple-converted-space"></span></span><br />
<span class="Apple-converted-space"></span><span >function</span><span >() {<span class="Apple-converted-space"></span></span><br />
<span > $(this).attr(’title’, ‘Test’);<span class="Apple-converted-space"></span></span><br />
<span > },<span class="Apple-converted-space"></span></span><br />
<span class="Apple-converted-space"></span><span >function</span><span >() {<span class="Apple-converted-space"></span></span><br />
<span > $(this).attr(’title’, ‘OK’);<span class="Apple-converted-space"></span></span><br />
<span > }<span class="Apple-converted-space"></span></span><br />
<span >);</span></p>
</blockquote>
<p><span >使用JQuery的好处是它包?了各种浏览器版本对DOM对象的操作，因此统一使用$(this)而不再用this应该是比较不错的选择。</span><br />
<br />
</p>
</div>
</div>