實(shí)例講解JQuery中this和$(this)區(qū)別
平時(shí)很少在jquery中用到this。查看代碼時(shí)發(fā)現(xiàn)用到了，就調(diào)試出this的值，心想原來(lái)如此。還是挺有用的。這里總結(jié)一下this與$(this)的區(qū)別和使用。
$(this)生成的是什么？
$()生成的是什么呢？實(shí)際上$()=jquery()，就是說(shuō)返回的是一個(gè)jquery的對(duì)象。
通常我們?yōu)榱撕?jiǎn)便直接使用$()。實(shí)際上，該函數(shù)省略了一個(gè)參數(shù)context。根據(jù)選擇器選取匹配的對(duì)象即$(selector, context)，以jQuery包裝集的形式返回。
context可以是Dom對(duì)象集合或jQuery包裝集，傳入則表示要從context中選擇匹配的對(duì)象，不傳入則表示范圍為文檔對(duì)象(即頁(yè)面全部對(duì)象)，即$(selector)=$(selector,document)。
this指的是，調(diào)用函數(shù)的那個(gè)html對(duì)象。
例子：
$("#textbox").hover(
function() {
this.title = "Test";
},
fucntion() {
this.title = "OK”;
}
);
這里的this其實(shí)是一個(gè)Html元素(textbox)，this是js中的。textbox有text屬性，所以這樣寫沒(méi)什么問(wèn)題。
$("#textbox").hover(
function() {
$(this).title ＝ "Test";
},
function() {
$(this).title = "OK";
}
);
這里的$(this)是一個(gè)JQuery對(duì)象，而jQuery對(duì)象沒(méi)有title 屬性，因此這樣寫是錯(cuò)誤的。
結(jié)論：
this，表示當(dāng)前的上下文對(duì)象是一個(gè)html對(duì)象，可以調(diào)用html對(duì)象所擁有的屬性和方法。
$(this),代表的上下文對(duì)象是一個(gè)jquery的上下文對(duì)象，可以調(diào)用jquery的方法和屬性值。
實(shí)例（選項(xiàng)卡）：
tabs($("#nav a"), $(".content"));
function tabs(tab, content){
content.hide();
content.eq(0).show();
tab.click(function(){
var index = tab.index(this);
tab.removeClass("current");
$(this).addClass("current");
content.hide();
content.eq(index).animate({opacity:'show'}, 200);
});
}
- jQuery AJAX回調(diào)函數(shù)this指向問(wèn)題
- jQuery 選擇方法及$(this)用法實(shí)例分析
- 淺談jQuery this和$(this)的區(qū)別及獲取$(this)子元素對(duì)象的方法
- jQuery中$this和$(this)的區(qū)別介紹（一看就懂）
- 詳談jQuery中的this和$(this)
- 通過(guò)$(this)使用jQuery包裝后的方法或?qū)傩?/a>
- jquery $(this).attr $(this).val方法使用介紹
- jquery中this的使用說(shuō)明
- JQuery this 和 $(this) 的區(qū)別
- JQuery中this的指向詳解
相關(guān)文章
jQuery 利用$.ajax 時(shí)獲取原生XMLHttpRequest 對(duì)象的方法
這篇文章主要介紹了jQuery 利用$.ajax 時(shí)獲取原生XMLHttpRequest 對(duì)象的方法,非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下2016-08-08
jQuery基于json與cookie實(shí)現(xiàn)購(gòu)物車的方法
這篇文章主要介紹了jQuery基于json與cookie實(shí)現(xiàn)購(gòu)物車的方法,涉及jQuery操作json格式數(shù)據(jù)與cookie存儲(chǔ)購(gòu)物車信息的相關(guān)技巧,需要的朋友可以參考下2016-04-04
這篇文章分享一下easyui常用的兩種表單異步提交的方式,本文通過(guò)示例代碼給大家分享兩種方法,感興趣的朋友一起看看吧2023-12-12
本文主要給大家匯總介紹了了jQuery獲取頁(yè)面及個(gè)元素高度、寬度的方法，非常的實(shí)用，有需要的小伙伴可以參考下。下面的例子是基于jquery的參數(shù)與方法來(lái)快速獲取文檔或?yàn)g覽器可視區(qū)域的高度與寬度的代碼,希望本例子能給你帶來(lái)一些幫助。2016-01-01
解析ajaxFileUpload 異步上傳文件簡(jiǎn)單使用
本篇文章主要介紹了ajaxFileUpload 異步上傳文件簡(jiǎn)單使用，jQuery插件AjaxFileUpload可以實(shí)現(xiàn)ajax文件上傳。有興趣的可以了解一下，2016-12-12
jquery text(),val(),html()方法區(qū)別總結(jié)
jquery text(),val(),html()方法區(qū)別總結(jié)。需要的朋友可以過(guò)來(lái)參考下，希望對(duì)大家有所幫助2013-11-11
jquery中常用的SET和GET$(”#msg”).html循環(huán)介紹
jquery中常用的SET和GET$(”#msg”).html循環(huán)想必大家并不陌生吧，本文整理了一些，感興趣的朋友可以參考下2013-10-10
這篇文章主要為大家詳細(xì)介紹了jQuery實(shí)現(xiàn)容器間的元素拖拽功能，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2020-12-12
EasyUI 數(shù)據(jù)表格datagrid列自適應(yīng)內(nèi)容寬度的實(shí)現(xiàn)
這篇文章主要介紹了EasyUI 數(shù)據(jù)表格datagrid列自適應(yīng)內(nèi)容寬度的實(shí)現(xiàn)，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2019-07-07
用Jquery.load載入頁(yè)面實(shí)現(xiàn)局部刷新
用jquery.load的方法載入新的頁(yè)面，以實(shí)現(xiàn)局部刷新，可結(jié)果發(fā)現(xiàn)載入進(jìn)來(lái)的頁(yè)面與原來(lái)單獨(dú)的頁(yè)面不一樣，樣式?jīng)]了，關(guān)于這個(gè)問(wèn)題，下面有個(gè)不錯(cuò)的解決方法2014-01-01