jQuery.parent() 函式詳解

 jQuery.parent() 函式詳解

parent()函式用於選取每個匹配元素的父元素，並以jQuery物件的形式返回。

你還可以使用選擇器來進一步縮小選取範圍，篩選出符合指定選擇器的元素。

該函式屬於jQuery物件(例項)。

語法

jQueryObject.parent( [ selector ] )

引數

parent()函式將選取當前jQuery物件每個匹配元素的符合選擇器selector的父元素。

如果省略selector引數，則選取所有的父元素。

返回值

parent()函式的返回值為jQuery型別，返回一個新的jQuery物件，該物件封裝了當前jQuery物件每個匹配元素的符合選擇器selector(如果指定了的話)的所有父元素。

如果沒有符合條件的元素，則返回空的jQuery物件。

示例&說明

以下面這段HTML程式碼為例：

<div id="n1">
<p id="n2"></p>
<p id="n3">
<span id="n4" class="foo"></span>
</p>
</div>
<div id="n5" class="bar">
<p id="n6" class="foo"></p>
</div>

以下jQuery示例程式碼用於演示parent()函式的具體用法：

// 返回jQuery物件所有匹配元素的標識資訊陣列
// 每個元素形如：tagName或tagName#id(如果有id的話)
function getTagsInfo($doms){
return $doms.map(function(){
return this.tagName + (this.id ? "#" + this.id : "");
}).get();
}

var $n2 = $("#n2");

// 獲取n2的父元素
var $parents1 = $n2.parent();
document.writeln( getTagsInfo( $parents1 ) ); // DIV#n1

var $p = $("p");

// 獲取所有p元素的父元素
var $parents2 = $p.parent();
document.writeln( getTagsInfo( $parents2 ) ); // DIV#n1,DIV#n5

// 獲取所有p元素的包含類名"bar"的父元素
var $parents3 = $p.parent(".bar");
document.writeln( getTagsInfo( $parents3 ) ); // DIV#n5

var $foo = $(".foo");

//獲取所有包含類名"foo"的元素的父元素
var $parents4 = $foo.parent();
document.writeln( getTagsInfo( $parents4 ) ); // P#n3,DIV#n5