الفرق بين المراجعتين لصفحة: «jQuery/addBack»

من موسوعة حسوب
التعديل اللاحق ←
مرئينص الويكي
أنشأ الصفحة ب'<noinclude>{{DISPLAYTITLE:التابع <code>‎.addBack()‎</code>‎ في jQuery}}</noinclude>'
 
طلا ملخص تعديل
سطر 1: سطر 1:
<noinclude>{{DISPLAYTITLE:التابع <code>‎.addBack()‎</code>‎ في jQuery}}</noinclude>
<noinclude>{{DISPLAYTITLE:التابع <code>‎.addBack()‎</code>‎ في jQuery}}</noinclude>
== <code>‎.addBack( [selector ] )‎</code> ==
=== القيمة المعادة ===
كائن [[jQuery/jQuery|jQuery]].
=== الوصف ===
يُستخدَم التّابع ‎<code>.addBack()</code>‎ لإضافة مجموعة العناصر الموجودة سابقًا في المَكْدَس (stack) إلى المجموعة الحاليّة، مع إمكانيّة ترشيحها بشكل اختياري عن طريق مُحدِّد (selector).
=== <code>‎.addBack( [selector ] )‎</code> ===
أضيفت في الإصدار: 1.8
==== <code>selector</code> ====
مُحدِّد، ويُمثِّل سلسلة نصيّة تحتوي على تعبير المُحدِّد المطلوب مُطابقة مجموعة العناصر الحاليّة معه.
كما هو موصوف في صفحة التّابع ‎[[jQuery/end|.end()]]‎ تحتفظ كائنات jQuery بمكدس داخلي يتتبع التغييرات إلى مجموعة العناصر المُوافقة. عندما يُستدعى أحد توابع التحكّم في DOM تُدفَع مجموعة العناصر الجديدة في المكدس. يُساعدنا التّابع <code>‎.addBack()‎</code> في حال كنّا نرغب بالاحتفاظ بمجموعة العناصر الموجودة سابقًا.
فلنأخذ هذا المثال عن صفحة تحتوي على قائمة بسيطة:<syntaxhighlight lang="html">
<ul>
  <li>list item 1</li>
  <li>list item 2</li>
  <li class="third-item">list item 3</li>
  <li>list item 4</li>
  <li>list item 5</li>
</ul>
</syntaxhighlight>ينتج عن الشّيفرة التالية خلفيّة حمراء خلف عناصر القائمة الثّالث والرّابع والخامس:<syntaxhighlight lang="javascript">
$( "li.third-item" ).nextAll().addBack()
  .css( "background-color", "red" );
</syntaxhighlight>في البداية يجد المُحدِّد المبدئي العنصر الثالث من القائمة، ممّا يُؤدِّي إلى تهيئة المكدس بمجموعة تحتوي فقط على هذا العنصر، ثمّ يدفع استدعاء التابع <code>‎.nextAll()</code>‎ العناصر 4 و 5 إلى المكدس، وأخيرًا يدمج التّابع <code>‎.addBack()‎‎</code> هاتين المجموعتين معًا، مُنشِئًا بذلك كائن jQuery يُشير إلى العناصر الثّلاثة بحسب ترتيبها في المستند:<syntaxhighlight lang="html">
{[<li.third-item>,<li>,<li> ]}‎
</syntaxhighlight>
=== أمثلة ===
يُؤدّي التّابع ‎<code>.addBack()</code>‎‎ لإضافة مجموعة عناصر DOM الموجودة سابقًا في المكدس إلى المجموعة الحاليّة. في المثال الأول من الشّيفرة التالية يحتوي المكدس على المجموعة النّاتجة عن ‎<code>.find("p")‎</code>، وفي المثال الثّاني يُضيف التّابع ‎<code>.addBack()</code>‎‎ مجموعة العناصر الموجودة سابقًا في المكدس وهي في هذه الحالة ‎<code>$("div.after-addback")</code>‎ إلى المجموعة الحاليّة وبالتالي تحديد عنصر <code>[[HTML/div|div]]</code> والفقرات الموجودة ضمنه:<syntaxhighlight lang="html">
<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>addBack demo</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>
<div class="left">
  <p><strong>Before <code>addBack()</code></strong></p>
  <div class="before-addback">
    <p>First Paragraph</p>
    <p>Second Paragraph</p>
  </div>
</div>
<div class="right">
  <p><strong>After <code>addBack()</code></strong></p>
  <div class="after-addback">
    <p>First Paragraph</p>
    <p>Second Paragraph</p>
  </div>
</div>
<script>
$( "div.left, div.right" ).find( "div, div > p" ).addClass( "border" );
// المثال الأول
$( "div.before-addback" ).find( "p" ).addClass( "background" );
// المثال الثاني
$( "div.after-addback" ).find( "p" ).addBack().addClass( "background" );
</script>
</body>
</html>
</syntaxhighlight>
== مصادر ==
* [http://api.jquery.com/addBack/ صفحة التابع ‎.addBack()‎ في توثيق jQuery الرسمي].
[[تصنيف:jQuery]]
[[تصنيف:jQuery Method]]
[[تصنيف:jQuery Traversing]]

مراجعة 21:53، 3 مايو 2018


‎.addBack( [selector ] )‎

القيمة المعادة

كائن jQuery.

الوصف

يُستخدَم التّابع ‎.addBack()‎ لإضافة مجموعة العناصر الموجودة سابقًا في المَكْدَس (stack) إلى المجموعة الحاليّة، مع إمكانيّة ترشيحها بشكل اختياري عن طريق مُحدِّد (selector).

‎.addBack( [selector ] )‎

أضيفت في الإصدار: 1.8

selector

مُحدِّد، ويُمثِّل سلسلة نصيّة تحتوي على تعبير المُحدِّد المطلوب مُطابقة مجموعة العناصر الحاليّة معه.

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

فلنأخذ هذا المثال عن صفحة تحتوي على قائمة بسيطة:

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

ينتج عن الشّيفرة التالية خلفيّة حمراء خلف عناصر القائمة الثّالث والرّابع والخامس:

$( "li.third-item" ).nextAll().addBack()
  .css( "background-color", "red" );

في البداية يجد المُحدِّد المبدئي العنصر الثالث من القائمة، ممّا يُؤدِّي إلى تهيئة المكدس بمجموعة تحتوي فقط على هذا العنصر، ثمّ يدفع استدعاء التابع ‎.nextAll()‎ العناصر 4 و 5 إلى المكدس، وأخيرًا يدمج التّابع ‎.addBack()‎‎ هاتين المجموعتين معًا، مُنشِئًا بذلك كائن jQuery يُشير إلى العناصر الثّلاثة بحسب ترتيبها في المستند:

{[<li.third-item>,<li>,<li> ]}‎

أمثلة

يُؤدّي التّابع ‎.addBack()‎‎ لإضافة مجموعة عناصر DOM الموجودة سابقًا في المكدس إلى المجموعة الحاليّة. في المثال الأول من الشّيفرة التالية يحتوي المكدس على المجموعة النّاتجة عن ‎.find("p")‎، وفي المثال الثّاني يُضيف التّابع ‎.addBack()‎‎ مجموعة العناصر الموجودة سابقًا في المكدس وهي في هذه الحالة ‎$("div.after-addback")‎ إلى المجموعة الحاليّة وبالتالي تحديد عنصر div والفقرات الموجودة ضمنه:

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>addBack demo</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>
 
<div class="left">
  <p><strong>Before <code>addBack()</code></strong></p>
  <div class="before-addback">
    <p>First Paragraph</p>
    <p>Second Paragraph</p>
  </div>
</div>
<div class="right">
  <p><strong>After <code>addBack()</code></strong></p>
  <div class="after-addback">
    <p>First Paragraph</p>
    <p>Second Paragraph</p>
  </div>
</div>
 
<script>
$( "div.left, div.right" ).find( "div, div > p" ).addClass( "border" );
 
// المثال الأول
$( "div.before-addback" ).find( "p" ).addClass( "background" );
 
// المثال الثاني
$( "div.after-addback" ).find( "p" ).addBack().addClass( "background" );
</script>
 
</body>
</html>

مصادر

مجلوبة من «https://wiki.hsoub.com/index.php?title=jQuery/addBack&oldid=7391»