طريقة parents() لجنيب jQuery

مثال

البحث عن جميع العناصر الأم لكل عنصر b:

$("b").parents()

جرب بنفسك

التعريف والاستخدام

parents() يحصل على العناصر الأبوية لكل عنصر في مجموعة العناصر التي تتطابق مع التعبير النصي، يمكن استخدام التعبير النصي للفرز اختياريًا.

.parents()selector)
المعاملات وصف
selector قيمة سلسلة، تحتوي على تعبير المحدد المستخدم للتنسيق مع العناصر.

شرح مفصل

إذا تم تقديم jQuery Object يمثل مجموعة عناصر DOM، فإن طريقة .parents() تسمح لنا بالبحث في العناصر الأبوية لهذه العناصر في شجرة DOM، وبناء jQuery Object جديد من العناصر التي تتطابق مع من أقرب عنصر أبوي إلى أعلى. يتم إرجاع العناصر وفقًا للترتيب من أقرب عنصر أبوي إلى الخارج. .parents() و .parent() الطريقة مشابهة، ولكن الفرق هو أنها تمرح على مستوى DOM فقط.

يقبل هذا الطريقة تعبير المحدد اختياري، بنفس نوع المعاملات التي نرسلها إلى دالة $(). إذا تم تطبيق هذا المحدد، فإنه سيتم تصفية العناصر عن طريق فحص العنصر لمعرفة ما إذا كان يطابق المحدد.

فكر في هذه الصفحة التي تحتوي على قائمة متداخلة أساسية:

<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>

إذا بدأنا من العنصر A، فإننا نستطيع العثور على عناصر الأبوة الخاصة به:

$('li.item-a').parents().css('background-color', 'red');

جرب بنفسك

نتيجة هذا النداء هي، إعداد خلفية اللون الأحمر للعناصر مثل قائمة المستوى-2، العنصر II، والقائمة المستوى-1 وما إلى ذلك (على طول شجرة DOM حتى <html>). لأننا لم نطبق تعبير المحدد، أصبح العنصر الوالدي طبيعيًا جزءًا من العنصر. إذا تم تطبيق المحدد، فإنه سيتم فحص العنصر لمعرفة ما إذا كان يطابق المحدد قبل أن يتضمن العنصر. لأننا لم نطبق تعبير المحدد، أصبح جميع العناصر الأبوية جزءًا من العنصر الذي يعود به jQuery. إذا تم تطبيق المحدد، فإنه سيتم تضمين العناصر التي تطابق المحدد فقط.