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

عام 0 geek4arab
Spread the love
  أساسيات في الجافا سكريبت .  أضيف في: 8-6-1427هـ
في هذا الدرس سأقوم بعرض عدد من الأمثلة الأساسية و التي تعين على استيعاب الجافا سكريبت جيدا ..

أولا : إخفاء الكود في المتصفحات التي لا تدعم الجافا سكريبت :


PHP CODE:
0001
0002
0003
0004
0005
0006
0007
0008
0009
0010
0011
0012
0013
0014
0015
0016
0017

</center>
<center> <html dir="rtl">
<head>
<title>مثال توضيحي في الجافا سكريبت</title>
<script language="javascript"></center>
<center>  <!- Begin hiding Java Script </center>
<center>
document.write("مرحبا في أول مثال للجافا سكريبت"); </center>
<center>  // End hiding Java Script ->
</script>
</head>
<body>
</body>
</html>
</center>
<center>


نتيجة المثال السابق

لاحظنا فيما سبق وجود أجزاء إضافية و هي -!> و الذي يعبر عن بدأ اخفاء الأكواد التي تليه و ليست في نفس سطره في حالة عدم تمكن المستكشف من عرض الكود .. و ننهي هذا الاعلان ب <- كما نرى في المثال السابق , كما نلاحظ اننا استخدمنا document.write بدلا من alert و التي تقوم بعرض القيمة بين الأقواس على الوثيقة document أي صفحة المستكشف بدلا من عرض رسالة .

تانيا : التعليقات :

كما أننا نستطيع استخدام خواص التعليق كما في لغات البرمجة من اجل إضافة تعليقات عن الكود لا تظهر أثناء عرضه و لعمل تعليق نقوم بالتالي :

// هذا تعليق كتب في سطر واحد

أما عند الحاجة لاستخدام تعليق يحتاج أكثر من سطر نقوم بالتالي :

/* هذا الكود

متعدد الأسطر

من أجل التوضيح */

PHP CODE:
0001
0002
0003
0004
0005
0006
0007
0008
0009
0010
0011
0012
0013
0014
0015
0016

<?php html dir="rtl">
<head>
<title>مثال يوضح التعليقات</title>
</head>
<body>
<script language="javascript">
e("الجافا سكريبت");
// document.write("الفي بي سكريبت");
/* document.write("لغة الاستعلام");
document.write("قواعد البيانات");
*/
document.write("HTML");
</script>
</body>
</html>


هذا ناتج المثال السابق.


يتضح مما سبق ما يفعله نص التعليق حيث لم يظهر الا الجافا سكريبت و ال HTML أما الباقي فلم يظهر بسبب التعليق ..


ثالثا : استخدام مقدمة الوثيقة للتعريفات :

من ميزات الجافا سكريبت أننا نستطيع عمل عدد من التعريفات و نسندها الى اسم من خلاله نستطيع اظهار هذه البيانات و لنرى المثال :

PHP CODE:
0001
0002
0003
0004
0005
0006
0007
0008
0009
0010
0011
0012
0013
0014
0015
0016
0017

</center>
<center>
<html dir="rtl">
<head>
<title>استخدام مقدمة الوثيقة للتعريفات</title>
<script language="javascript">
greeting="هذا مثال يوضح التعريفات و استرجاعها"
</script>
</head>
<body>
<script language="javascript">
document.write(greeting)
</script>
</body>
</html></center>
<center>



هذا ناتج المثال السابق

رأينا كيف تم استدعاء كلمة greeting من مقدمة الوثيقة و تم استعراض قيمتها لكن ماذا يحدث لو جربنا أن نكتب :

document.write(“greeting”)

جرب بنفسك و لاحظ الفرق ….


رابعا : استخدام عناصر الHTML في أكواد الجافا سكريبت :

نعلم أن <table> في الHTML تقوم بتعريف جدول و <tr> تعرف صفا في الجدول و تقوم <td> بعمل خلية فيه .. و نعلم أن <p> معناهــا فقرة و أن <cite> تعني كتابة النص بشكل أدبي مائل .. و من الميزات الرائعة للجافا سكريبت دعمها الكامل لأجزاء الHTML و لنرى مثالا يشمــــل أكثر من جزء من أجزاء ال HTML :


PHP CODE:
0001
0002
0003
0004
0005
0006
0007
0008
0009
0010
0011
0012
0013
0014
0015
0016
0017
0018
0019
0020

<html dir="rtl">
<head>
<title>استخدام عناصر الهتمل</title>
<script language="javascript">
document.write("<table align=center border=2>")
document.write("<tr>")
document.write("<td>")
document.write("<p><cite>Script</cite></p>")
document.write("</td>")
document.write("<td>")
document.write("<p><b>Java</b></p>")
document.write("</td>")
document.write("</tr>")
document.write("</table>")
</script>
</head>
<body>
</body>
</html>


هذا ناتج المثال السابق.
أتوقع أنك الان بدأت تدخل في غمار هذه اللغة الممتعة … دعنا نرى ما تحتويه الدروس اللاحقة ..

الكاتب geek4arab

geek4arab

مواضيع متعلقة

التعليقات مغلقة