دورة تصميم قوالب بلوجر 2021 الدرس 8 لمحة عن javascript قسم 3 واخير



السلام عليكم واللهم صل على محمد وال محمد

نكمل اليوم بثامن دروس دورة تصميم قالب بلوجر 2021 من الصفر الى الاحتراف فبعد ان تكلمنا في الدروس السابقة عن 
نكمل اليوم مع لغة JavaScript ونبدء بسم الله

لمحة عن جافا سكربت قسم ثالث واخير

 في الجافا سكربت نقوم بانشاء قيم ثابته او معرف عناصر تعرف باسم var
تفيد المعرفات بتسهيل كتابة الكود او الخصائص مثال على ذالك
var mytest = document.getElementById("test")
هنا قمت بانشاء معرف باسم mytest يقوم باستدعاء الكود عن طريق الايدي test
ما الفائدة من المعرف؟
الان عندما اريد تنفيذ اي من الخواص التي تعلمناها سابقا على الكود الذي يحمل الايدي test لا داعي لكتابة كود الاستدعاء كاملا فقط اكتب اسم المعرف ثم اقوم بتطبيق الخاصية مثال على ذالك
<p id="test">هنا النص الذي سيتم تلوينه</p>
var mytest = document.getElementById("test")
mytest.style.color=red;
في المثال السابق قمت بتعريف معرف باسم mytest يقوم باستدعاء الكود عن طريق الايدي ثم عن طريق اسم المعرف اعطيت لون للنص مباشرة
طبعا المعرفات تفيد عند تطبيق اكثر من خاصية على كود بايدي واحد لعدم كتابة كود الاستدعاء كاملا كل مرة اريد اضافة خاصية معينة فقط اقوم بكتابة اسم المعرف ويستخدم بكثرة عند استدعاء عن طريق الكلاس او اسم التاغ حيث من غير المعقول عند تطبيق خاصية معينة على اكثر من كود بنفس الكلاس بكل مرة اكتب كود الاستدعاء كاملا 
 نلاحظ بالامثلة السابقة جميع الاستدعائات استخدمنا الاستدعاء عن طريق الايدي وذالك لان
عند الاستدعاء بالايدي يتم تطبيق الخواص التي سوف نتعلمها مباشرة اما عند الاستدعاء عن طريق التاغ او الكلاس فنحتاج الى تحديد رقم العنصر او انشاء for او كما بالعربي حلقة دائرية 
مثال على استدعاء عن طريق كلاس او تاغ نيم مع تحديد رقم العنصر
<p>اول فقرة</p>
<p>ثاني فقرة.</p>
document.getElementsByTagName("p")[0].style.backgroundColor = "yellow";
كما نلاحظ بالمثال السابق قمنا باستدعاء عن طريق تاغ نيم ثم اعطينا ستايل وهو لون خلفية بلون اصفر نلاحظ بعد الاستدعاء يوجد رقم داخل قوسين بهذا الشكل [0] وهذا يدل على رقم العنصر في مثالنا هنا قمنا بتحديد بان اول تاغ p هو الذي سيتم تلوين خلفيته بالاصفر وقمنا باختيار رقم 0 وليس 1 لان في الجافا سكربت يبدأ العد من 0 وليس من 1 فلو وضعنا رقم 1 بدل 0 سيتم تلوين خلفية الفقرة الثانية وليس الاولى
الان لو نريد كما بالمثال السابق تلوين الخلفية بالاصفر ولكن لا نريد تلوين فقرة واحدة بل الفقرتان في هذه الحالة نحتاج الى انشاء for 
ليصبح الكود بالشكل التالي
var e = document.getElementsByTagName("p")
for(i=0; i < e.length; i++ ){
e[i].style.backgroundColor = "yellow";
}
باختصار انشئنا var تستدعي الفقرات باستخدام اسم التاغ ثم انشئنا for حددنا بداخلها قيمة i تبدأ من تساوي صفر الى i  تساوي اصغر من عدد الفقرات الكلي لدينا لان في الجاف سكربت يبدأ العد من صفر ولكن النتيجة النهائية تكون من 1 يعني مثلا بالمثال السابق يبدأ العد من 0 اي اول فقرة ثم 1 اي ثاني فقرة لكن العدد الكلي للفقرات بحسب الجافا سكربت هو 2 لذالك حددنا قيمت i النهائية اصغر من العدد الكلي ثم جعلنا ال i تكمل العد نيابة عنا في الكود ليتم بذالك وضع الخلفية باللون الاصفر لكل الفقرات الموجودة
ينطبق المثال السابق على الاستدعاء عن طريق الكلاس ايضا
كما قلت دائما مشاهدة الفيديو توضح الامور اكثر
طبعا خواص الجافا سكربت طويلة وتحتاج للكثير من الدروس لتغطيتها ولكن هذه منها اهم الخصائص تقريبا ومنها لمحة لتفهم اللغة بشكل عام

شرح الفيديو

والان الى اللقاء صديقي بدرس قادم لاتنسى صندوق التعليقات موجود خصيصا لاجلك لذالك لاتتردد في اي سؤال او استفسار ويسعدني الاجابة عليك
كاتب الموضوع: Ahmad Wael
احمد وائل عمري 28 عام من سوريا مختص صيانة حسوب وموبايل ومحب للتقنية بجميع اشكالها ولدي خبرة برمجية بتصميم مواقع الويب واتمنى ان اكون مصدر جيد لتعليم اشياء مفيدة لكم