در اینجا منظور از فرزندان یک عنصر، فرزند، نوه، فرزندِ نوه و به همین ترتیب است.

در جی کوئری با استفاده از روش های پیمایش، می توان یک درخت DOM را برای یافتن فرزندان یک عنصر به سمت پایین پیمایش کرد.

پیمایش درخت DOM به سمت پایین

دو روش زیر برای پیمایش درخت DOM به سمت پایین در جی کوئری وجود دارد:

  • ()children
  • ()find

متد ()children در jQuery

متد ()children اولین فرزند عنصر انتخابی را بر می گرداند.

این متد تنها یک سطحِ رو به پایین را در درخت DOM پیمایش می کند.

مثال زیر تمامی عناصری که فرزند مستقیم تگ <div> هستند را بر می گرداند:

نکته: یک عنصر را فرزند مستقیم عنصری دیگر می گویند هرگاه اختلاف سطح دو عنصر صفر باشد. یعنی بین این دو عنصر، عنصر دیگری قرار نگرفته باشد.

مثال (پیدا کردن فرزندان یک عنصر در jQuery)

$(document).ready(function(){
$("div").children();
});

خودتان امتحان کنید »

برای محدود کردن جستجوی فرزندان یک عنصر می توان یک سری از پارامترها را اعمال کرد.

مثال زیر تمامی تگ های <P> با کلاس "1" که فرزند مستقیم تگ <div> هستند را بر می گرداند:

مثال (پیدا کردن فرزندان یک عنصر در jQuery)

$(document).ready(function(){
$("div").children("p.1");
});

خودتان امتحان کنید »

متد ()find در jQuery

متد ()find کلیه فرزندان یک عنصر را تا رسیدن به آخرین فرزند، بر می گرداند.

مثال زیر کلیه عناصر <span> که نوه تگ <div> هستند را برمی گرداند: 

مثال (پیدا کردن فرزندان یک عنصر در jQuery)

$(document).ready(function(){
$("div").find("span");
});

خودتان امتحان کنید »

مثال زیر کلیه فرزندان (نوادگان) تگ <div> بر می گرداند:

مثال (پیدا کردن فرزندان یک عنصر در jQuery)

$(document).ready(function(){
$("div").find("*");
});

خودتان امتحان کنید »

مرجع کلیه متدهای پیمایش در jQuery

برای اطلاع از سایر متد های پیمایش در جی کوئری می توانید از لینک روبرو استفاده کنید: مرجع متدهای پیمایش عناصر در jQuery