پیدا کردن فرزندان یک عنصر در jQuery
در اینجا منظور از فرزندان یک عنصر، فرزند، نوه، فرزندِ نوه و به همین ترتیب است.
در جی کوئری با استفاده از روش های پیمایش، می توان یک درخت DOM را برای یافتن فرزندان یک عنصر به سمت پایین پیمایش کرد.
پیمایش درخت DOM به سمت پایین
دو روش زیر برای پیمایش درخت DOM به سمت پایین در جی کوئری وجود دارد:
- ()children
- ()find
متد ()children در jQuery
متد ()children اولین فرزند عنصر انتخابی را بر می گرداند.
این متد تنها یک سطحِ رو به پایین را در درخت DOM پیمایش می کند.
مثال زیر تمامی عناصری که فرزند مستقیم تگ <div> هستند را بر می گرداند:
نکته: یک عنصر را فرزند مستقیم عنصری دیگر می گویند هرگاه اختلاف سطح دو عنصر صفر باشد. یعنی بین این دو عنصر، عنصر دیگری قرار نگرفته باشد.
مثال (پیدا کردن فرزندان یک عنصر در jQuery)
$("div").children();
});
خودتان امتحان کنید »
برای محدود کردن جستجوی فرزندان یک عنصر می توان یک سری از پارامترها را اعمال کرد.
مثال زیر تمامی تگ های <P> با کلاس "1" که فرزند مستقیم تگ <div> هستند را بر می گرداند:
مثال (پیدا کردن فرزندان یک عنصر در jQuery)
$("div").children("p.1");
});
خودتان امتحان کنید »
متد ()find در jQuery
متد ()find کلیه فرزندان یک عنصر را تا رسیدن به آخرین فرزند، بر می گرداند.
مثال زیر کلیه عناصر <span> که نوه تگ <div> هستند را برمی گرداند:
مثال (پیدا کردن فرزندان یک عنصر در jQuery)
$("div").find("span");
});
خودتان امتحان کنید »
مثال زیر کلیه فرزندان (نوادگان) تگ <div> بر می گرداند:
مثال (پیدا کردن فرزندان یک عنصر در jQuery)
$("div").find("*");
});
خودتان امتحان کنید »
مرجع کلیه متدهای پیمایش در jQuery
برای اطلاع از سایر متد های پیمایش در جی کوئری می توانید از لینک روبرو استفاده کنید: مرجع متدهای پیمایش عناصر در jQuery
- نوشته شده توسط شهربانو دوستی
- بازدید: 12574
دیدگاه‌ها
میخام به هرچی تگ br توی div هست یه چیزی اضافه کنم . این br رو با find نتونستم پیدا کنم . به نظرتون میشه همچین کار کرد ؟
با سلام.
برای اضافه کردن به تگ br می‌تونید از تکه کد زیر استفاده کنید.
$("div br").after(your text html);
توسط سلکتور بالا شما می‌تونید به تگ‌های br داخل تگ div متنی رو اضافه کنید. دقت کنید برای اینکه دقیقا بعد از تگ قرار بگیره، از after استفاده می‌کنیم. متن شما your text html می‌تونه در قالب یه متن ساده یا حاوی تگ‌های html باشه.
مثال سوم یعنی:
$(document).ready(function(){
$("div").find("span");
});
شما فرمودین که: کلیه فرزندان تگ تا رسیدن به عنصر برمی گرداند.
ولی کلیه span هارو برمیگردونه نه کلیه فرزندان رو... چون تگ p خودش فرزند تگ div هست ولی تگ span نوه ی تگ div هست.
بله حق با شماست، در مثال بالا، کلیه عناصر که نوه تگ هستند برمیگردند.