تكليفات JavaScript Bootcamp من الدرس 086 إلى 093

[ 6 ] تكليفات خاصة ب [ Document Object Model ]

إنضم لكورسات الأكاديمية وإستفيد من الخصم الخاص في البداية من هنا
نوصي بكورس تعلم أساسيات البرمجة من أكاديمية Codezilla من هنا
إحترف التسويق وإدارة الأعمال مع الدبلومة الإحترافية وإحصل على خصم عن طريقنا من هنا
لحجز إستضافة من Hostinger والحصول على الخصم عن طريقي إتبع الشرح من هنا

من جوجل

المقاطع المطلوب مشاهدتها

الدروس من رقم 086 إلى رقم 093 من الدورة التعليمية الموجودة هنا

التكليف 01

لديك العنصر التالي في ال HTML عليك إختياره بال JavaScript ب 15 طريقة مختلفة
يمكنك إستخدام querySelector أربع مرات فقط وكذلك querySelectorAll اربع مرات فقط

التكليف 02

  • لدينا مجموعة من الصور في الصفحة عبارة عن 10 صور بلا Source
  • المطلوب هو تغيير ال Src Attribute لصورة اللوجو التالية “https://elzero.org/wp-content/themes/elzero/imgs/logo.png”
  • تغيير محتوى ال Alt Attribute ل Elzero Logo
  • يجب عمل Loop يقوم بالوظيفة مباشرة ولا تقوم بتكرار ال Code
النتيجة المطلوبة هي العنصر التالي مكرر عشر مرات

التكليف 03

  • لديك النموذج التالي الخاص بتحويل العملات
  • كل ما عليك هو كتابة العملة بالدولار داخل حقل الإدخال
  • في مكان النتيجة اسفل حقل الإدخال يجب عليك إظهار العملة بالدولار والمقابل لها بالجنيه المصري
  • الشخص يمكن أن يكتب الرقم أو يقوم بعمل Paste للرقم أيضا
  • يمكنك تغيير ال div الخاص بالنتيجة وتقوم بالتعديل عليه كما تحب
  • لا تقوم بتعديل حقل الإدخال ابدا
  • تنسيقات ال CSS لتجميل الشكل فقط لو أردت عملها لا توجد مشكل
  • الدولار = 15.6 جنيه مصري
  • تأكد ان الكسور التي تظهر في النتيجة لا تتعدي رقمين فقط. مثلا 1500.32
شاهد الصورة التالية لترى المطلوب وتفهم اكثر

التكليف 04

  • لديلك عنصريين محتواهم وال Attributes الخاصة بهم مبعثرة
  • المطلوب نقل المحتوى وال Title Attribute من ال div الأول للثاني ومن الثاني للأول
  • غير مسموح نهائيا كتابة أرقام أو Strings أو إستعمال True أو False بإستثناء أسماء ال Classes طبعا
  • يجب عليك إضافة رقم 2 بجانب كلمة Two
  • شاهد النتيجة لترى المطلوب
ال Code الحالي
النتيجة المطلوبة


التكليف 05

  • لديك 5 صور في الصفحة بعضهم يحتوي على ال Alt Attributes والباقي لا
  • قم بعمل Loop على جميع الصور وتأكد أن ال Alt Attribute موجود أم لا
  • في حالة كان موجود قم بتغيير القيمة إلى الكلمة Old
  • في حالة لم يكن موجود قم بتغيير القيمة إلى Elzero New
  • شاهد النتيجة لترى المطلوب
النتيجة المطلوبة

التكليف 06 تحدي

  • لديك حقل إدخال تقوم بكتابة عدد العناصر التي تريد إنشائها
  • لديك حقل آخر يحتوي على نوع العنصر سواء كان Div أو Section
  • لديك حقل إدخال لكتابة الكلمة التي ستظهر داخل العنصر
  • لديك زر لبدا عملية الإنشاء
  • عند الضغط على إنشاء العناصر تأكد أن اي عناصر قديمة تم إنشاءها سوف يتم إزالتها أولا
  • يمكنك عمل تنسيقات ال CSS بال JavaScript في حالة كنت تريد التمرين على التنسيق بال JavaScript
  • يمكنك عمل التنسيق بشكل طبيعي بال CSS بدون أي مشكلة
  • تأكد أن ال Form لا تقوم بإرسال البيانات حتى لا يتم عمل Refresh للصفحة
  • العنصر يحتوي على ID و Class وال ID يزداد رقم مع كل عنصر شاهد المثال المطلوب لتفهم
النتيجة المطلوبة داخل ال results div هي كالتالي حسب العدد الذي إخترته وحسب نوع العنصر
شاهد الصورة التالية لترى المطلوب وتفهم اكثر

تسليم ومراجعة الحلول

الحلول النموذجية هي هدية للداعمين يمكنك الإنضمام للداعمين لترى جميع الحلول من هنا

من جوجل

0 تعليقات


    اترك تعليقاً