jQuery

JQueryで子要素を取得するメソッド

More than 1 year has passed since last update.

findメソッド

findメソッドは、すべての子孫要素(自分よりも下の階層の要素すべて)の中から、指定したセレクタを持つ要素を取得したいときに用いる。

下図の例では、<div id="wrapper">から</div>の中にあるすべての<a>要素を取得することができる。

<div di="wrapper">
    <a href="#">リンク1</a>
    <p>
        <a href="#">リンク2</a>
    </p>
</div>

リンク1、2両方にcssが適用される。

$('#wrapper').find('a').css('color','red');

childrenメソッド

childrenメソッドは、指定したセレクタが持つ子要素(一階層だけ下)の中から指定したセレクタに合致した要素を取得したいときに用いる。

下の例では<div id="wrapper">の子要素は<a>タグ<p>タグが一つずつなので、<a>タグが一つ取得される。

<div di="wrapper">
    <a href="#">リンク1</a>
    <p>
        <a href="#">リンク2</a>
    </p>
</div>

リンク1のみにcssが適用される。

$('#wrapper').children('a').css('color','red');