もう使われなくなってきたjQueryですが、コードを読むときにやたらjQueryが使われている&Reactを用いた開発でもjQueryと共存ができるのでさきほど勉強をはじめました。
そこでfind()とchildren()が似てたので、使い分けについて説明していきます。
find()とchildren()の違いとは
小要素を取得できる階層の違い
です。
find()
は小要素すべてを取得でき、children()
は1階層下の要素のみ取得できます。
HTMLが以下のときに
<div id="セレクタ">
<a>あいうえお</a>
<div>
<a>かきくけこ</a>
</div>
</div>
find()の場合
$('セレクタ').find('a');
で、親要素のセレクタ内にある小要素すべて
の<a>
を取得します。
なので、あいうえおとかきくけこ両方取得できます。
children()の場合
$('セレクタ').children('a');
で、親要素のセレクタ内にある1階層下
の小要素<a>
のみ取得します。
なので、あいうえおのみ取得できます。