جميل نت >>   تعليم ودورات  >>  الجافا سكريبت

الجافا سكريبت

لإنشاء ووضع كود (SCRIPT) جافا سكريبت داخل مستند HTML

الآن سنتعلم بعض الأساسيات لإنشاء ووضع كود (SCRIPT) جافا سكريبت داخل مستند HTML

وذلك من خلال هذا الكود (SCRIPT) الذي سيظهر في الصفحة عبارة " هذا النص لونه أحمر " بحيث تظهر باللون الأحمر ... الكود (SCRIPT) بسيط ولكنه يصلح كبداية :
 

<SCRIPT   LANGUAGE="javascript">
document.write("<FONT COLOR='RED'>هذا النص لونه أحمر</FONT>")
</SCRIPT>


 


نتيجة الكود (SCRIPT) :

هذا هو ما سيظهر في الصفحة :
 

هذا النص لونه أحمر


تحليل الكود (SCRIPT) :

سنبدأ في تحليل الكود (SCRIPT) خطوة خطوة :
- أول سطر في الكود (SCRIPT) هو :
 

<SCRIPT   LANGUAGE="javascript">

 

هذا السطر يجب أن يكون أول سطر في أي كود (SCRIPT) جافا سكريبت حيث أنه ينبه المتصفح بأن ما سيتبع هذا الأمر هو Javascript .
- اسمح لي هذه المرة أن أنتقل للسطر الثالث والأخير مباشرة سنجد أنه :

 

</SCRIPT>

إذن هذا هو آخر سطر في أي كود (SCRIPT) ولا توجد إستثناءات في ذلك . وهذه الخطوة تنبه المتصفح إلي نهاية الكود (SCRIPT) .
إذن تذكر هذا جيدا وأحفظه في إحدي خلايا مخك الرمادية :

   أي كود (SCRIPT) يجب أن يبدأ بالسطر :

<SCRIPT   LANGUAGE="javascript">

وينتهي بالسطر :

</SCRIPT>



إتفقنا؟ ... حسنا لنعود إلي تحليل الكود (SCRIPT) ... السطر الثاني في الكود (SCRIPT) عبارة عن :
 

document.write("<FONT COLOR='RED'>هذا النص لونه أحمر</FONT>")
 

في هذا السطر يتم إنذار المستند (document) بأنه سيكتب به (write) ما بداخل الأقواس . وما بداخل الأقواس هو عبارة عن أمر عادي من أوامر HTML الذي يأمر المتصفح بأظهار الجملة "هذا النص لونه أحمر " باللون الأحمر .
إذن فإن من قام بأمر المتصفح بإظهار الجملة باللون الأحمر هو ال HTML وليس الجافا سكريبت ..!! . ولكننا هنا عرفنا أنه من الممكن كتابة أوامر ال HTML داخل أوامر الجافا سكريبت . لاحظ هنا جيدا شكل الأمر :

 

document.write("<FONT COLOR='RED'>هذا النص لونه أحمر</FONT>")
 

شكل الأمر هكذا ويجب أن يكون دائما هكذا ... دعنا نفرض أنك نسخت هذا الكود (SCRIPT) ولصقته في معالج نصوص ذو حدود ضيقة ... بمعني أنك عندما لصقته ظهر هكذا :
 

document.write("<FONT COLOR='RED'>هذا النص لونه أحمر</FONT>
")
 

في هذه الحالة أنت غيرت شكل الأمر (لاحظ أن القوس الذي ينهي الأمر قد إنتقل سطرا لأسفل) ولن يعمل هذا الكود (SCRIPT) ويكون قد حدث خطأ . إذا ففي أكواد الجافا سكريبت يجب مراعاة الشكل و المسافات علي عكس ال HTML .

لنعود للمسار المتبع في هذا الأمر ... الأمر يبدأ ب (document) ويطلق عليه كائن (Object) --والكائن هو مستند أو صورة أو صندوق نصوص أو أزرار وما شابه-- ثم بعد ذلك تأتي كلمة (write) ويطلق عليها النهج (Method) الخاص بالكائن (document) وبعد النهج تأتي دائما أقواس بداخلها ما سيحدث عند تطبيق النهج (Method) علي الكائن (Object) . لا تقلق نفسك إذا لم تستوعب ذلك جيدا فسوف نتعرض لشكل الأمر هذا في كل درس بحيث ستفهمه وتستوعبه جيدا إن شاء الله .

لاحظ أن ما بين الأقواس تم وضعه بين علامتي تنصيص مزدوجة (" ") . في ال HTML علامات التنصيص هذه غير ضرورية أما هنا في الجافا سكريبت فهي ضرورية ولابد منها . في مثالنا هنا .. ما بين علامتي التنصيص هو عبارة عن HTML ولاحظ أننا احتجنا وضع علامات تنصيص حول كلمة RED وحيث أنه لا يمكن إستخدام علامة التنصيص المزدوجة (") وإلا سيظن المتصفح ان هذا هو نهاية السطر . لذا وضعنا علامات تنصيص مفردة (') حول RED لتصبح هكذا 'RED' كما هو مبين في الكود (SCRIPT) بأعلي .

إذن تذكر:

  بين علامتي التنصيص المزدوجة استخدم علامات تنصيص مفردة عند الحاجة .

إذا نخرج من هذا الدرس بالنقاط التالية :

- عند كتابة كود (SCRIPT) يجب أن نبدأ دائما ب :
 

<SCRIPT   LANGUAGE="javascript">

وينتهي بالسطر :
 

</SCRIPT>



 

- بين علامتي التنصيص المزدوجة استخدم علامات تنصيص مفردة عند الحاجة .

- أحد أشكال الأمر في الجافا سكريبت هو :
أن نبدأ بالكائن (Object) الذي نريد إجراء الأمر عليه ثم بعد الكائن يأتي النهج (Method) الذي نريد تطبيقه علي الكائن .. ويتبع النهج دائما أقواس تحتوي علي ما سيحدث في الكائن (Object) عند تطبيق النهج (Method) عليه . في مثالنا بأعلي ... الكائن هو (document) والنهج هو (write) ..... إذاً عندما نريد كتابة شيء في صفحة الويب نستخدم النهج (write) دائما ونضع بين الأقواس ما نريد كتابته في الصفحة . هل ما زلت معي؟؟


 

والآن قد إنتهينا من هذا الدرس ونتمنى للجميع التوفيق ... جميل نت

 

 

المصدر : موقع الصقر

البداية

لحفظ هذا الدرس file > save as <