jQuery مرور - روش next()

مثال

علامت‌های همسایه بعدی هر بخش را پیدا می‌کند، تنها بخش‌هایی با نام کلاس "selected" انتخاب می‌شوند:

$("p");.next(".selected");.css("background", "yellow");

به طور شخصی امتحان کنید

تعریف و استفاده

next() علامت‌های همسایه نزدیک به هر علامت در مجموعه تطبیق داده شده را دریافت می‌کند. اگر یک انتخاب‌کننده ارائه شود، علامت همسایه بعدی که با آن مطابقت دارد را بازمی‌گرداند.

قوانین دستور زبان

.next(selector)
پارامتر شرح
selector مقدار رشته‌ای که شامل عبارت انتخاب‌کننده‌ای است که برای تطبیق علامت‌ها استفاده می‌شود.

شرح

اگر یک جعبه jQuery که مجموعه‌ای از علامت‌های DOM را نشان می‌دهد داده شود، روش .next() به ما اجازه می‌دهد تا علامت همسایه بعدی در درخت DOM را جستجو کنیم و جعبه جدید jQuery با استفاده از علامت‌های مطابقت داده شده ایجاد کنیم.

این روش یک عبارت انتخاب‌کننده انتخابی را می‌پذیرد، که نوعی مشابه با آنچه که من به تابع $() ارسال می‌کنم است. اگر علامت همسایه بعدی با این انتخاب‌کننده مطابقت دارد، در جعبه جدید jQuery باقی می‌ماند؛ در غیر این صورت، آن را حذف می‌کند.

به این صفحه با لیست ساده فکر کنید:

<ul>
   <li>نقش 1</li>
   <li>نقش 2</li>
   <li class="third-item">نقش 3</li>
   <li>نقش 4</li>
   <li>نقش 5</li>
</ul>

اگر ما از پروژه سوم شروع کنیم، می‌توانیم علامت‌های بعدی آن را پیدا کنیم:

$('li.third-item');.next();.css('background-color', 'red');

به طور شخصی امتحان کنید

نتیجه این فراخوانی این است که پروژه 4 به رنگ پس‌زمینه قرمز تنظیم شده است. چون ما هیچ عبارت انتخاب‌کننده‌ای را اعمال نکرده‌ایم، علامت بعدی به وضوح به عنوان بخشی از یک شیء شامل می‌شود. اگر ما قبلاً یک انتخاب‌کننده را اعمال کرده باشیم، قبل از شامل کردن آن، بررسی می‌شود که آیا با آن مطابقت دارد یا خیر.