كيفية استخدام كود الجافاسكربت JavaScripts داخل صفحة HTML

من طرف **Admin** الخميس 25 يونيو - 17:23

كيفية استخدام كود الجافاسكربت JavaScripts

أين نستخدم الكود
يمكن استخدام كود الجافاسكربت JavaScripts داخل وسمي أو في صفحة HTML

استخدام الجافاسكربت ضمن

في المثال التالي سنكتب التاريخ ضمن وسم

عند تحميل الصفحة .

مثال

الكود:: <html> <body> <h1>أول صفحة جافاسكربت</h1> <p id="demo"></p> <script type="text/javascript"> document.getElementById("demo").innerHTML=Date(); </script> </body> </html>

لاحظ أن كود الجافاسكربت تم وضعه في أسفل الصفحة وكن متأكداً أنه في آخر الصفحة أي بعد وسم

لأنه اذا تم وضع قبله فلن يعمل بشكل جيد .

وظائف وأحداث جافاسكربت JavaScript

يظهر عادة كود الجافاسكربت JavaScript في صفحات HTML عند تحميل الصفحة ولكن ليس هذا مانريده دائماً .

أحياناً نحتاج لإدارج كود الجافاسكربت عند حدوث حدث معين أي عند ضغط المستخدم على زر معين وفي هذه الحالة يمكن اضافة سكربت داخل كود وظيفي function .

تستخدم عادة الأحداث مع الأكواد الوظيفية مثل استدعاء كود وظيفي عند حدوث حدث معين .

ستتعلم المزيد عن الوظائف والأحداث في دروس لاحقة .

استخدام الجافاسكربت ضمن

في المثال التالي سيتم استدعاء كود وظيفي عند الضغط على زر .

مثال

الكود:: <html> <head> <script type="text/javascript"> function displayDate() { document.getElementById("demo").innerHTML=Date(); } </script> </head> <body> <h1>أول صفحة جافاسكربت</h1> <p id="demo"></p> <button type="button" onclick="displayDate()">عرض تاريخ اليوم</button> </body> </html>

الأكواد ضمن و

يمكنك إدارج أكواد غير محدودة في صفحتك الويب كما يمكن إدراج الأكواد في كلاً من و في نفس الوقت .

كما هو شائع وضع جميع أكواد الجافاكربت ضمن رأس الصفحة أو في نهاية الصفحة وبهذه الطريقة يمكن استخدام جميع الأكواد بدون التعارض مع محتوى الصفحة .

استخدام ملف JavaScript خارجي

يمكن استخدام أكواد الجافاسكربت في ملفات منفصلة .
غالباً مايحتوي الملف الخارجي على أكواد يمكن استخدامها في أماكن متعددة ومختلفة .
ان صيغة ملف الجافاسكربت الخارجي هي .js
ملاحظة : لايجب استخدام وسوم عند استخدام الملف الخارجي للجافاسكربت .

لاستخدام كود جافاسكربت منفصل يجب تحديد اسم ومكان الملف باستخدام اللاحقة src ضمن الوسم في صفحة HTML

مثال

الكود:: <html> <head> <script type="text/javascript" src="xxx.js"></script> </head> <body> </body> </html>

ملاحظة : لاتنسى استدعاء ملف الجافاسكربت تماماً في المكان الذي ترغب إظهار فيه الكود .

ѕαα∂ ∂єѕιgη