Simple To-Do List
تفاصيل العمل
الهيكل العام:
يبدأ الكود بعنوان الصفحة وتحديد لغة الصفحة.
تم تعيين تنسيق الصفحة باستخدام العنصر <style>.
يتضمن الجزء الجسمي <body> العناصر اللازمة لتنفيذ التطبيق.
العناصر والتنسيق:
تحتوي <div> ذو الصنف .container على عناصر التطبيق.
العنصر <h1> يعرض عنوان التطبيق "Simple To-Do List".
العنصر <input> يمكن المستخدم من إدخال مهمة جديدة.
العنصر <ul> يتم فيه عرض قائمة المهام.
العنصر <li> يمثل عنصرًا في قائمة المهام.
العنصر <span> يعرض نص المهمة.
العنصر <button> يمكن المستخدم من حذف المهمة.
التفاعل:
تم استخدام الحدث keydown على عنصر <input> للتقاط ضغطة زر "Enter".
عند الضغط على زر "Enter"، يتم استدعاء الدالة addTask() لإضافة المهمة.
الدالة addTask() تقوم بإنشاء عنصر <li> جديد وإضافته إلى قائمة المهام (<ul>).
الدالة removeTask(button) تقوم بحذف عنصر المهمة عند الضغط على زر "Remove" المرتبط به.