عرض مصدر jQuery/andSelf

<noinclude>{{DISPLAYTITLE:التابع <code>‎.andSelf()‎‎</code>‎ في jQuery}}</noinclude>

= <code>‎.andSelf()‎</code> =

=== القيمة المعادة ===
كائن [[jQuery/jQuery|jQuery]].

أُهمِل هذا التّابع في الإصدار: 1.8، وأُزيل في الإصدار: 3.0.

=== الوصف ===
يُستخدَم التّابع ‎<code>.andSelf()‎</code> في إضافة مجموعة العناصر الموجودة سابقًا في المَكدَس (stack) إلى المجموعة الحاليّة.

=== <code>‎.andSelf()‎</code> ===
أُضيفت في الإصدار: 1.2.

لا يقبل هذا التابع أيّة وسائط.

'''ملاحظة:''' أصبح هذا التّابع مهملًا، ويُعتبَر الآن اسمًا بديلًا (alias) للتابع <code>‎.addBack()‎</code> والذي يجب استخدامه في إصدار jQuery 1.8 فما بعد.

كما هو موصوف في صفحة التّابع ‎<code>[[jQuery/end|.end()]]</code>‎ تحتفظ كائنات jQuery بمَكدَس داخلي يتتبّع التغييرات إلى مجموعة العناصر المُوافقة. عندما يُستدعى أحد توابع التحكّم في DOM تُدفَع مجموعة العناصر الجديدة في المكدس. يُساعدنا التّابع <code>‎.andSelf()‎</code> إن كُنّا نرغب بالاحتفاظ بمجموعة العناصر الموجودة سابقًا.

فلنأخذ مثالًا عن صفحة تحتوي على قائمة بسيطة:<syntaxhighlight lang="html">
<ul>
 <li>العنصر 1 في القائمة</li>
 <li>العنصر 2 في القائمة</li>
 <li class="third-item">العنصر 3 في القائمة</li>
 <li>العنصر 4 في القائمة</li>
 <li>العنصر 5 في القائمة</li>
</ul>


</syntaxhighlight>ينتج عن الشّيفرة التالية خلفيّة حمراء خلف عناصر القائمة الثّالث والرّابع والخامس:<syntaxhighlight lang="javascript">
$( "li.third-item" ).nextAll().andSelf()
 .css( "background-color", "red" );
</syntaxhighlight>في البداية يجد المُحدِّد المبدئي العنصر الثالث من القائمة، ممّا يُؤدِّي إلى تهيئة المَكدَس بمجموعة تحتوي فقط على هذا العنصر، ثمّ يدفع استدعاء التابع ‎<code>.nextAll()‎</code> العناصر 4 و 5 إلى المَكدَس، وأخيرًا يدمج التّابع <code>‎.andSelf()</code>‎‎‎ هاتين المجموعتين معًا، مُنشِئًا بذلك كائن jQuery يُشير إلى العناصر الثّلاثة بحسب ترتيبها في المستند:

<code>{[<li.third-item>,<nowiki><li>,<li> ]}</nowiki></code>

=== أمثلة ===
يُؤدّي التّابع <code>‎.andSelf()</code>‎ لإضافة مجموعة عناصر DOM الموجودة سابقًا في المكدس إلى المجموعة الحاليّة. في المثال الأول من الشّيفرة التالية يحتوي المكدس على المجموعة النّاتجة عن ‎.find("p")‎، وفي المثال الثّاني يُضيف التّابع ‎.andSelf()‎‎‎ مجموعة العناصر الموجودة سابقًا في المكدس وهي في هذه الحالة ‎‎$( "div.after-andself" )‎‎ إلى المجموعة الحاليّة وبالتالي تحديد عنصر [[HTML/div|‎<nowiki><div>‎</nowiki>]] والفقرات الموجودة ضمنه:

<!doctype html>

<html lang="en">

<head>

 <meta charset="utf-8">

 <title>andSelf مثال عن التّابع</title>

 <style>

 p, div {

   margin: 5px;

   padding: 5px;

 }

 .border {

   border: 2px solid red;

 }

 .background {

   background: yellow;

 }

 .left, .right {

   width: 45%;

   float: left;

 }

 .right {

   margin-left: 3%;

 }

 </style>

 <script src="https://code.jquery.com/jquery-1.10.2.js"></script>

</head>

<body>

<nowiki><div class="left"></nowiki>

 <nowiki><p><strong>قبل استخدام التّابع <code>andSelf()</code></nowiki><nowiki></strong></nowiki><nowiki></p></nowiki>

 <nowiki><div class="before-andself"></nowiki>

   <nowiki><p>الفقرة الأولى</p></nowiki>

   <nowiki><p>الفقرة الثانية</p></nowiki>

 <nowiki></div></nowiki>

<nowiki></div></nowiki>

<nowiki><div class="right"></nowiki>

 <nowiki><p><strong>بعد استخدام التّابع <code>andSelf()</code></nowiki><nowiki></strong></nowiki><nowiki></p></nowiki>

 <nowiki><div class="after-andself"></nowiki>

  <nowiki><p>الفقرة الأولى</p></nowiki>

  <nowiki><p>الفقرة الثانية</p></nowiki>

 <nowiki></div></nowiki>

<nowiki></div></nowiki>

<script>

$( "div.left, div.right" ).find( "div, div > p" ).addClass( "border" );

// First Example

$( "div.before-andself" ).find( "p" ).addClass( "background" );

// Second Example

$( "div.after-andself" ).find( "p" ).andSelf().addClass( "background" );

</script>

</body>

</html>

== مصادر ==
* صفحة التابع ‎‎.andSelf()‎ في توثيق jQuery الرسمي.