الدرس 5 من 8
تفويض الأحداث
- 14 دقيقة
- 4 معايير للتصحيح
- 3 تلميحات
- إلى المطلوب
هدف الدرس
مستمع واحد لعناصر تتغيّر
01
الشرح
لو ربطت مستمعًا بكل زر حذف، ماذا يحدث للأزرار التي تُضاف بعد ذلك؟ لا شيء — لم يكن لها مستمع يوم ربطت.
الحلّ أن الحدث يصعد من العنصر المضغوط إلى آبائه. فتربط مستمعًا واحدًا بالحاوية، وتسأل داخله: من المضغوط فعلًا؟
event.target.closest('.del') يجيب: العنصر المضغوط أو أقرب جدّ له يطابق المُحدِّد، وإلا null.
02
المطلوب
مستمع واحد على #list يحذف العنصر عند الضغط على زر حذفه — بما في ذلك العناصر المُضافة لاحقًا.
معايير التصحيح
4 معايير- الضغط على «حذف» يزيل عنصره
- الضغط داخل العنصر بعيدًا عن الزر لا يحذف شيئًا
- يعمل على عنصر أُضيف بعد ربط المستمع
- مستمع واحد فقط: حذف عنصرين متتاليين يعمل