の 親（） jQuery のメソッドは、指定されたセレクターの直接の親を検索します。これはjQueryの組み込み関数です。このメソッドは、DOM ツリー内の 1 レベル上のみをトラバースし、選択した要素の直接の親を返します。
ウルフィ・ジャベドとは誰ですか
の 親（） 方法はと似ています 両親（） メソッドはどちらも DOM ツリーまで移動し、親要素を返します。しかし、違いは、 両親（） このメソッドは、DOM ツリー内の複数のレベルを走査し、指定されたセレクターの祖父母、曽祖父母などを含むすべての祖先を返します。 親（） このメソッドは単一レベルを上に移動し、指定されたセレクターの直接の親のみを返します。
構文
$(selector).parent(filter)
の セレクタ 上記の構文の は、親が検索される選択された要素を表します。の フィルター 上記の構文の は、検索を絞り込むために使用されるセレクター式を指定するオプションのパラメーターです。
例1
この例では、 親（） 方法。ここには、次の要素を含む div 要素があります。 ウル 要素、見出し h2 、段落要素。
を適用しています。 親（） 見出し h2 の親を検索するメソッド。を使用すると、 両親（） メソッドを使用する代わりに、 親（） メソッドを実行すると、body 要素を含む見出し h2 のすべての祖先が強調表示されます。
.main *{ font-size: 20px; border: 2px solid black; color: black; padding: 10px; margin: 17px; } function fun(){ $(document).ready(function(){ $('h2').parent().css({ 'font-size': '30px', 'color': 'blue', 'border': '6px dashed blue'}); }); } div <ul> ul <h2> Heading h2 <p> Paragraph element </p> </h2> </ul> click me 今すぐテストしてください 出力：
上記のコードを実行すると、出力は次のようになります -
指定されたボタンをクリックすると、出力は次のようになります -
例2
この例では、 親（） 最初の段落要素の親を検索するメソッド。ここでは複数の段落要素がありますが、最初の段落要素の親を見つける必要があります。したがって、擬似セレクタを渡しています( ：初め ) のオプションの値として 親（） 方法。
.main *{ font-size: 20px; border: 2px solid black; color: black; padding: 5px; margin: 10px; } function fun() { $(document).ready(function(){ $('p').parent(':first').css({'color': 'blue', 'border': '3px dashed blue'}); }); } body div1 div2 <h2> h2 <p> Paragraph element </p> </h2> <h2> h2 <p> Paragraph element </p> </h2> click me 上記のコードを実行すると、出力は次のようになります -
指定されたボタンをクリックすると、出力は次のようになります -
例3
この例では、 親（） 指定されたセレクターの特定の親を検索するメソッド。ここには、異なる親を持つ 3 つの段落要素があります。私たちが見つけているのは、 h2 段落要素の親。したがって、同じことを達成するには、 h2 のオプションの値として 親（） 方法。
.main *{ font-size: 20px; border: 2px solid black; color: black; padding: 5px; margin: 10px; } function fun() { $(document).ready(function(){ $('p').parent('h2').css({'color': 'blue', 'border': '5px dashed blue'}); }); } body div1 div2 <p> Paragraph element </p> <h2> h2 <p> Paragraph element </p> </h2> <ul> ul <p> Paragraph element </p> </ul> click me 今すぐテストしてください 出力：
上記のコードを実行すると、出力は次のようになります -
指定されたボタンをクリックすると、出力は次のようになります -
