jQuery中parents()的使用說明
更新時(shí)間：2010年11月28日 14:52:38 作者：
今天遇到一個(gè)有意思的問題，jquery有兩個(gè)函數(shù)parent()和parents().通過這兩個(gè)函數(shù)可以找到一個(gè)對(duì)象的父對(duì)象，又稱作jquery的選擇器。
舉個(gè)例子：
<body>
<div id="one">
<div id="two">hello</div>
<div id="three">
<p>
<a href="#">tonsh</a>
</p>
</div>
</div>
$("a").parent()將會(huì)得到父對(duì)象<p>
$("a").parents()得到父對(duì)象為<p><div.3><div.1>
$("a").parents().filter("div")將得到<div.3><div.1>,還可以寫成$("a").parents("div")。
如果想的到<div.2>對(duì)象可以寫成這樣：$("a").parents("div:eq(0)")。
如果點(diǎn)擊<a>鏈接時(shí)彈出<div.2>中的內(nèi)容該怎么辦？
var id=$("a").parents("div:eq(1)").children("div:eq(0)").html();
alert(id);
這種類似下標(biāo)的用法很容易就得到了我們想要的內(nèi)容，只要沒有搞混這些下標(biāo)的順序。
jquery parents使用舉例
[Ctrl+A 全選 注:引入外部Js需再刷新一下頁面才能執(zhí)行]
復(fù)制代碼 代碼如下:
<body>
<div id="one">
<div id="two">hello</div>
<div id="three">
<p>
<a href="#">tonsh</a>
</p>
</div>
</div>
$("a").parent()將會(huì)得到父對(duì)象<p>
$("a").parents()得到父對(duì)象為<p><div.3><div.1>
$("a").parents().filter("div")將得到<div.3><div.1>,還可以寫成$("a").parents("div")。
如果想的到<div.2>對(duì)象可以寫成這樣：$("a").parents("div:eq(0)")。
如果點(diǎn)擊<a>鏈接時(shí)彈出<div.2>中的內(nèi)容該怎么辦？
復(fù)制代碼 代碼如下:
var id=$("a").parents("div:eq(1)").children("div:eq(0)").html();
alert(id);
這種類似下標(biāo)的用法很容易就得到了我們想要的內(nèi)容，只要沒有搞混這些下標(biāo)的順序。
jquery parents使用舉例
[Ctrl+A 全選 注:引入外部Js需再刷新一下頁面才能執(zhí)行]
相關(guān)文章
這里主要是jQuery美化部分的實(shí)例，美化對(duì)象為文本框、密碼框、文本域、Select下拉框、按鈕等，有了這些示例，美化其它的表單元素應(yīng)該不是大問題。2015-04-04
jquery實(shí)現(xiàn)圖片等比例縮放以及max-width在ie中不兼容解決
圖片等比例縮放在某些情況下還是比較事用的,不過max-width和max-height在ie6中不兼容問題很是郁悶，接下來使用jQuery解決這個(gè)問題，感興趣的各位可以參考下哈2013-03-03
jquery實(shí)現(xiàn)的仿天貓側(cè)導(dǎo)航tab切換效果
這篇文章主要介紹了jquery實(shí)現(xiàn)的仿天貓側(cè)導(dǎo)航tab切換效果,涉及jquery鼠標(biāo)事件及鏈?zhǔn)讲僮鲗?shí)現(xiàn)頁面元素樣式遍歷切換效果的技巧,非常具有實(shí)用價(jià)值,需要的朋友可以參考下2015-08-08
jQuery在ie6下無法設(shè)置select選中的解決方法詳解
這篇文章主要介紹了jQuery在ie6下無法設(shè)置select選中的解決方法,結(jié)合實(shí)例分析了jQuery在ie6下無法設(shè)置select選中的原因與相關(guān)處理技巧,需要的朋友可以參考下2016-09-09
JQuery EasyUI學(xué)習(xí)教程之datagrid 添加、修改、刪除操作
這篇文章主要介紹了JQuery EasyUI datagrid 添加、修改、刪除操作的相關(guān)資料,非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下2016-07-07
Jquery動(dòng)態(tài)列功能完整實(shí)例
這篇文章主要介紹了Jquery動(dòng)態(tài)列功能,結(jié)合完整實(shí)例形式詳細(xì)分析了jQuery基于事件響應(yīng)及頁面元素動(dòng)態(tài)屬性操作實(shí)現(xiàn)的動(dòng)態(tài)列顯示功能相關(guān)操作技巧,需要的朋友可以參考下2019-08-08
jquery處理checkbox（復(fù)選框）是否被選中實(shí)例代碼
這篇文章主要介紹了jquery處理checkbox（復(fù)選框）是否被選中實(shí)例代碼的相關(guān)資料,需要的朋友可以參考下2017-06-06
jquery trim() 作用是，刪除字符串兩邊出現(xiàn)的空格2011-02-02
用JQuery 實(shí)現(xiàn)AJAX加載XML并解析的腳本
用JQuery 實(shí)現(xiàn)AJAX加載XML并解析的腳本2009-07-07
這篇文章主要介紹了jQuery內(nèi)容過濾選擇器用法,結(jié)合實(shí)例形式分析了jQuery中使用contains、empty、has、parent等進(jìn)行內(nèi)容過濾的操作技巧,需要的朋友可以參考下2016-09-09