أين نستخدم الكود




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



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


في المثال التالي سنكتب التاريخ ضمن وسم <p> عند تحميل الصفحة .

مثال
<html>
<body>
<h1>أول صفحة جافاسكربت</h1>
<p id="demo"></p>

<script type="text/javascript">
document.getElementById("demo").innerHTML=Date();
</script>

</body>
</html>


لاحظ أن كود الجافاسكربت تم وضعه في أسفل الصفحة وكن متأكداً أنه في آخر الصفحة أي بعد وسم <p> لأنه اذا تم وضع قبله فلن يعمل بشكل جيد .




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


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

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

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

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




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


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

مثال
<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>




الأكواد ضمن <body> و <head>


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

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



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


  • يمكن استخدام أكواد الجافاسكربت في ملفات منفصلة .

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

  • ان صيغة ملف الجافاسكربت الخارجي هي .js

ملاحظة : لايجب استخدام وسوم <script></script> عند استخدام الملف الخارجي للجافاسكربت .

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

مثال

<html>
<head>
<script type="text/javascript" src="xxx.js"></script>
</head>
<body>

</body>
</html>



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


ليست هناك تعليقات:

إرسال تعليق