jQuery جستجو - روش children()
مثال
همه فرزندان div با نام کلاس "selected" را پیدا کرده و آن‌ها را به رنگ آبی تنظیم کنید:
$("div").children(".selected").css("color", "blue");
تعریف و استفاده
روش .children() تمام فرزندان انتخاب شده را بازمی‌گرداند.
نحوه‌ی استفاده
.children(selector)
| پارامتر | توضیح |
|---|---|
| selector | مقدار رشته‌ای که شامل عبارت انتخابگر برای عناصر مطابقت‌دار است. |
شرح دقیق
اگر یک جاوااسکریپت از مجموعه عناصر DOM ارائه شود، روش .children() به ما اجازه می‌دهد تا عناصر موجود در درخت DOM را به دست آوریم و جاوااسکریپت جدیدی با عناصر مطابقت‌دار بسازیم..find() مانند روش .children() است، اما این روش فقط در یک سطوح از درخت DOM حرکت می‌کند.
لطفاً توجه کنید که مانند بسیاری از روش‌های جومو، .children() نقطه‌های متن را باز نمی‌گرداند؛ اگر نیاز به دریافت همه فرزندان شامل نقطه‌های متن و نظرات دارید، از .contents() استفاده کنید.
این روش یک عبارت انتخابگر به عنوان پارامتر اختیاری می‌پذیرد، که نوع پارامتری که به $() ارسال می‌کنیم مشابه آن است. اگر این انتخابگر را اعمال کنیم، تست می‌کند که آیا عناصر با این عبارت مطابقت دارند یا خیر و این عناصر را برای فیلتر کردن استفاده می‌کند.
به این صفحه با لیست‌های پیچیده با اساس توجه کنید:
<ul class="level-1">
<li class="item-i">I</li>
<li class="item-ii">II
<ul class="level-2">
<li class="item-a">A</li>
<li class="item-b">B
<ul class="level-3">
<li class="item-1">1</li>
<li class="item-2">2</li>
<li class="item-3">3</li>
</ul>
</li>
<li class="item-c">C</li>
</ul>
</li>
<li class="item-iii">III</li>
</ul>
اگر ما از لیست level-2 شروع کنیم، می‌توانیم فرزندان آن را پیدا کنیم:
$('ul.level-2').children().css('background-color', 'red');
نتیجه این خط کد این است که پروژه A، B، C با پس‌زمینه قرمز نمایش داده می‌شوند. چون ما از عبارت انتخابگر استفاده نکرده‌ایم، جاوااسکریپت همه فرزندان را شامل می‌کند. اگر یک عبارت انتخابگر را اعمال کنیم، فقط پروژه‌های مطابقت‌دار شامل می‌شوند.
