jQuery函數(shù)的第二個參數(shù)獲取指定上下文中的DOM元素
更新時間：2014年05月19日 14:28:39 作者：
這篇文章主要介紹了jQuery函數(shù)的第二個參數(shù)獲取指定上下文中的DOM元素,需要的朋友可以參考下
jQuery函數(shù)的第二個參數(shù)可以指定DOM元素的搜索范圍。
第二個參數(shù)可分為以下類型
DOM reference
jQuery wrapper
document
代碼示例
<!DOCTYPE html>
<html>
<body>
<form>
<input name="" type="checkbox"/>
<input name="" type="radio"/>
<input name="" type="text"/>
<input name="" type="button"/>
</form>
<form>
<input name="" type="checkbox"/>
<input name="" type="radio"/>
<input name="" type="text"/>
<input name="" type="button"/>
</form>
<input name="" type="checkbox"/>
<input name="" type="radio"/>
<input name="" type="text"/>
<input name="" type="button"/>
<script type="text/javascript" src="jquery-1.11.1.js"></script>
<script type="text/javascript">
// search within all form elements, using a wrapper for context,
// alerts "8 inputs"
alert("selected" + $('input', $('form')).length + ' inputs');
// search with the first form element, using DOM reference as the context,
// alerts "4 inputs"
alert("selected" + $('input', document.forms[0]).length + ' inputs');
// search within the body element for all input elements using an expression,
// alerts "12 inputs"
alert("selected" + $('input', 'body').length + ' inputs');
</script>
</body>
</html>
總結(jié)
第二個參數(shù)的不同的類型，對應(yīng)的用法如下表所示。
第二個參數(shù)可分為以下類型
DOM reference
jQuery wrapper
document
代碼示例
復(fù)制代碼 代碼如下:
<!DOCTYPE html>
<html>
<body>
<form>
<input name="" type="checkbox"/>
<input name="" type="radio"/>
<input name="" type="text"/>
<input name="" type="button"/>
</form>
<form>
<input name="" type="checkbox"/>
<input name="" type="radio"/>
<input name="" type="text"/>
<input name="" type="button"/>
</form>
<input name="" type="checkbox"/>
<input name="" type="radio"/>
<input name="" type="text"/>
<input name="" type="button"/>
<script type="text/javascript" src="jquery-1.11.1.js"></script>
<script type="text/javascript">
// search within all form elements, using a wrapper for context,
// alerts "8 inputs"
alert("selected" + $('input', $('form')).length + ' inputs');
// search with the first form element, using DOM reference as the context,
// alerts "4 inputs"
alert("selected" + $('input', document.forms[0]).length + ' inputs');
// search within the body element for all input elements using an expression,
// alerts "12 inputs"
alert("selected" + $('input', 'body').length + ' inputs');
</script>
</body>
</html>
總結(jié)
第二個參數(shù)的不同的類型，對應(yīng)的用法如下表所示。
| 類型 | 用法 |
|---|---|
| jQuery wrapper | $('input', $('form')).length |
| DOM reference | $('input', document.forms[0]).length |
| document | $('input', 'body').length |
您可能感興趣的文章:
- jQuery學(xué)習(xí)筆記之jQuery的DOM操作
- 基于jquery的關(guān)于動態(tài)創(chuàng)建DOM元素的問題
- 讀jQuery之五（取DOM元素）
- JQuery動態(tài)創(chuàng)建DOM、表單元素的實現(xiàn)代碼
- JQuery each()函數(shù)如何優(yōu)化循環(huán)DOM結(jié)構(gòu)的性能
- jQuery移動和復(fù)制dom節(jié)點實用DOM操作案例
- 同域jQuery(跨)iframe操作DOM(實例講解)
- jQuery的DOM操作之刪除節(jié)點示例
- jquery選擇器排除某個DOM元素的方法（實例演示）
- jQuery1.9.1針對checkbox的調(diào)整方法(prop)
- Jquery方式獲取iframe頁面中的 Dom元素
- jQuery 刪除/替換DOM元素的幾種方式
- jQuery 如何先創(chuàng)建、再修改、后添加DOM元素
- jQuery如何將選中的對象轉(zhuǎn)化為原始的DOM對象
- jQuery 1.9.1源碼分析系列（十）事件系統(tǒng)之綁定事件
- jQuery-1.9.1源碼分析系列（十）事件系統(tǒng)之事件體系結(jié)構(gòu)
- jQuery-1.9.1源碼分析系列（十）事件系統(tǒng)之事件包裝
- Jquery1.9.1源碼分析系列（六）延時對象應(yīng)用之jQuery.ready
- jQuery 1.9.1源碼分析系列（十）事件系統(tǒng)之主動觸發(fā)事件和模擬冒泡處理
- Jquery-1.9.1源碼分析系列（十一）之DOM操作
相關(guān)文章
jQuery Easyui DataGrid點擊某個單元格即進(jìn)入編輯狀態(tài)焦點移開后保存數(shù)據(jù)
這篇文章主要介紹了jQuery Easyui DataGrid點擊某個單元格即進(jìn)入編輯狀態(tài)焦點移開后保存數(shù)據(jù)的相關(guān)資料,非常不錯，具有參考借鑒價值，需要的朋友可以參考下2016-08-08
jQuery 2.0.3 源碼分析之core（一）整體架構(gòu)
這篇文章主要介紹了jQuery 2.0.3 源碼分析之core（一）整體架構(gòu),需要的朋友可以參考下2014-05-05
jQuery使用cookie與json簡單實現(xiàn)購物車功能
這篇文章主要介紹了jQuery使用cookie與json簡單實現(xiàn)購物車功能的方法,介紹了jQuery實現(xiàn)購物車的步驟與關(guān)鍵代碼,需要的朋友可以參考下2016-04-04
jquery自動完成插件(autocomplete)應(yīng)用之PHP版
一般網(wǎng)上這個用于搜索功能增強(qiáng)，增加用戶體驗，還是不錯的。2009-12-12
雖然圓角頁面很好看，但一直以來都不太好實現(xiàn)，一方面是沒有CSS3，二是都得通過美工切圖切出來角。但這些麻煩事即將過去，就是因為它：jQuery Corner的出現(xiàn)！2014-08-08
這篇文章主要介紹了jQuery實現(xiàn)右下角可縮放大小的層,以完整實例形式分析了jQuery頁面元素及相關(guān)樣式屬性操作技巧,需要的朋友可以參考下2016-06-06
基于Jquery的仿照flash放大圖片效果代碼，需要的朋友可以參考下。2011-03-03
本文主要是介紹了jQuery中on方法及trigger方法，以及圍繞這個方法來體驗的觀察者模式，是篇非常不錯的文章，對我們理解觀察者模式很有幫助。2014-12-12
下面小編就為大家?guī)硪黄猨Query效果函數(shù)。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧，祝大家游戲愉快哦2016-09-09
jQuery實現(xiàn)氣球彈出框式的側(cè)邊導(dǎo)航菜單效果
這篇文章主要介紹了jQuery實現(xiàn)氣球彈出框式的側(cè)邊導(dǎo)航菜單效果,通過css樣式控制結(jié)合jQuery響應(yīng)鼠標(biāo)事件動態(tài)切換元素樣式實現(xiàn)提示框效果,非常美觀實用,需要的朋友可以參考下2015-09-09