التابع .prevAll() في jQuery
.prevAll( [selector ] )
القيم المعادة
يعيد كائنًا من النوع jQuery.
الوصف
يجلب هذا التابع جميع العناصر الأخوة التي تسبق كل عنصر في مجموعة العناصر المطابقة، ثمَّ يرشحها اختياريًّا باستعمال محدِّد.
.prevAll( [selector ] )
أُضيف مع الإصدار: 1.2.
selector
سلسلة نصية تحتوي على تعبير محدِّد لمطابقة العناصر.
عند إعطاء التابع .prevAll() كائن jQuery يمثل مجموعة عناصر DOM، فسيبحث عن جميع العناصر الأخوة السابقة لهذه العناصر في شجرة DOM ثمَّ سينشئ كائن jQuery جديد يضع فيه العناصر التي وجدها.
يقبل التابع اختياريًّا تعبير محدِّد لنفس النوع الذي يمكن تمريره إلى الدالة $(). إن طابقت تلك العناصر الأخوة هذا المحدِّد، فستبقى في كائن jQuery المُنشأ حديثًا آنذاك وإلا فستُستبعَد منه.
بفرض أنَّه لدينا صفحة تحتوي على قائمة بسيطة مثل:
<ul>
<li>العنصر الأول</li>
<li>العنصر الثاني</li>
<li class="third-item">العنصر الثالث</li>
<li>العنصر الرابع</li>
<li>العنصر الخامس</li>
</ul>
إن بدأنا عند العنصر الثالث، فسنعثر على جميع العناصر الأخوة التي يأتي قبله مباشرةً:
$( "li.third-item" ).prevAll().css( "background-color", "red" );
سيكون نتيجة تنفيذ هذه الشيفرة هو تغيير لون خلفية العنصر الثاني والأول إلى اللون الأحمر. بما أنَّنا لم نمرِّر تعبير محدِّد إلى التابع، فلا شك أنَّ هذين العنصرين سيضافان إلى الكائن. إن زودنا التابع بتعبير محدِّد معين، فسيتحقَّق من تطابق العنصرين قبل إضافتهما إلى الكائن.
أمثلة
مثال عن إيجاد جميع العناصر <div> التي تأتي قبل العنصر الأخير وإعطائهم صنفًا معينًا:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>prevAll مثالٌ عن استعمال التابع</title>
<style>
div {
width: 70px;
height: 70px;
background: #abc;
border: 2px solid black;
margin: 10px;
float: left;
}
div.before {
border-color: red;
}
</style>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
<div></div>
<div></div>
<div></div>
<div></div>
<script>
$( "div:last" ).prevAll().addClass( "before" );
</script>
</body>
</html>