jQueryで親要素を取得する3つの方法

jQueryで親要素を取得する方法は3つあります。

サンプルHTML

<div id="parent3">
    <div id="parent2">
        <div id="parent1">
            <div id="target"></div>
        </div>
    </div>
</div>

</div>

①parent()
一般的でシンプルな取得法。
以下の処理では#parent1が取得できます。

$("#target").parent();

1	$("#target").parent();

②parents()
先祖要素を取得するときに便利な方法。
以下の処理で#parent3が取得できます。

$("#target").parents('#parent3')

1	$("#target").parents('#parent3')

③closest()
直近の親要素を取得する方法。
parents()と同じく引数にセレクターを指定することもできます。

$("#target").closest('#parent3')

1	$("#target").closest('#parent3')