كيفية كتابة كود لغة الجافا سكريبت داخل ملف html
7.4 هزار بار بازدید -
5 سال پیش
-
وضع كود جافا سكريبت داخل
وضع كود جافا سكريبت داخل ملف HTML
تعلم طرق إضافة (كتابة) أكواد لغة الـ JavaScript إلى صفحة بلغة الترميز HTML، وكيف يتم إستخدام العنصر script؟ وماهي الأوصاف (attributes) التي تستخدم مع الوسم script؟ والفرق بين الوصف async و الوصف defer.
اولا: Inline Scripts - أكواد داخل الوسوم (عناصر الـ HTML)
وفي هذه الطريقة يتم كتابة أكواد لغة الـ JavaScript عن طريق وصف الوسم (attribute) المتعلق بالحدث (Event) الخاص بالعنصر، فعلى سبيل المثال، إذا أردت تنفيذ بعض الأوامر عند الضغط على العنصر، فإنك تستخدم الوصف onclick، وإذا أردت تنفيذ الأوامر عند الإشارة بمؤشر الفأرة على العنصر فإنك تستخدم الوصف onmouseenter، وهكذا. والمثال التالي يوضح كيفية كتابة الأكواد بهذه الطريقة.
ثانيا: أكواد داخل الوسم script
وفي هذه الطريقة يتم كتابة الأكواد من خلال إستخدام العنصر (الوسم) script، وهو العنصر المسئول عن تنفيذ أوامر الـ JavaScript داخل ملف الـ HTML، وهذا العنصر لا يظهر محتواه في صفحة الويب كباقي عناصر الـ HTML، حيث أن الإعدادات الإفتراضية لكل متصفحات الويب لهذا العنصر هي display: none; أي أن محتواه مخفي من الصفحة، وبإستخدام العنصر script يمكنك إضافة أكواد الـ JavaScript مباشرة داخل العنصر، أو كتابتها في ملف مستقل وإضافتها من خلال الوصف src، والمثال التالي سوف يوضح طريقة كتابة الأكواد.
عند إستخدام ملف خارجي لأكواد الـ JavaScript، فيجب لإضافته إلى صفحة الـ HTML أن يتم إستخدام الوصف src، وأن يكون العنصر script فارغ (لا يحتوي على أي أكواد بداخله).
يمكنك إضافة العنصر script في أي مكان بداخل صفحة الـ HTML، فيمكنك إضافة العنصر بداخل رأس الصفحة (بداخل العنصر head) أو يمكنك إضافته بداخل صفحة الـ HTML نفسها (بداخل الوسم body)، وهنا يمكنك كتابته في بداية الصفحة أو في نهايتها، ويمكنك إستخدام أكثر من عنصر في أكثر من مكان بداخل صفحة ويب واحدة.
ما هي الأوصاف (attributes) المستخدمة مع العنصر script
الوصف type: وتكون قيمته أي من أنواع الوسائط (media_types)، ويستخدم لتحديد نوع الأكواد الموجودة بداخل العنصر script، حيث يمكنك على سبيل المثال، كتابة أكواد بصيغة json داخل العنصرscript، وبالتالي يستخدم هذا الوصف لتحديد نوع الأكواد المستخدمة، ويعتبر هذا الوصف إجباري في حالة ما إذا كنت تستخدم الإصدار الرابع من لغة الترميز HTML، أما إذا كنت تستخدم الإصدار الخامس فيمكنك تجاهل (عدم كتابته) هذا الوصف، وبصفة شخصية أفضل كتابته أي كان الإصدار المستخدم من لغة الترميز HTML.
الوصف src: وتكون قيمته هي مسار ملف الـ JavaScript أو عنوانه الإلكتروني إذا كانت إستضافة الملف في مكان آخر، ويستخدم هذا الوصف لتحديد مكان الأكواد التي سوف يتم تنفيذها، وفي حالة إستخدام هذا الوصف يجب أن يكون العنصر script فارغ ولا يحتوي على أي أكواد بداخله.
الوصف defer: وتكون قيمته defer، ويستخدم هذا الوصف في حالة إستخدام ملف خارجي للأكواد، أو بمعنى آخر، لكي تستخدم هذا الوصف يجب أن يحتوي العنصر script على الوصف src، ووظيفة هذا الوصف هي أن يعلم المتصفح بأن ينفذ الأوامر الموجودة في الملف بعد الإنتهاء من قراءة وتحميل صفحة الـ HTML.
الوصف async: وتكون قيمته async، وهو أيضا يستخدم فقط في حالة إستخدام ملف خارجي، وأيضا يستخدم فقط إذا كنت تستخدم الإصدار الخامس من لغة الترميز HTML، ويستخدم لكي يتم تنفيذ الأوامر الموجودة في الملف الخارجي بعد الإنتهاء من تحميل الملف، وحتى إذا لم يكمل المتصفح تحميل وقراءة باقي مكونات صفحة الويب.
و بذلك نكون قد تعلمنا كيفية إضافة أكواد الـ JavaScript إلى صفحة الـ HTML، وأتمنى أن أكون قد تمكنت من تبسيط المعلومات، وإذا كان عندك أي إستفسار أو إقتراح بتعديل، فقط إعلمني من خلال التعليقات.
تعلم طرق إضافة (كتابة) أكواد لغة الـ JavaScript إلى صفحة بلغة الترميز HTML، وكيف يتم إستخدام العنصر script؟ وماهي الأوصاف (attributes) التي تستخدم مع الوسم script؟ والفرق بين الوصف async و الوصف defer.
اولا: Inline Scripts - أكواد داخل الوسوم (عناصر الـ HTML)
وفي هذه الطريقة يتم كتابة أكواد لغة الـ JavaScript عن طريق وصف الوسم (attribute) المتعلق بالحدث (Event) الخاص بالعنصر، فعلى سبيل المثال، إذا أردت تنفيذ بعض الأوامر عند الضغط على العنصر، فإنك تستخدم الوصف onclick، وإذا أردت تنفيذ الأوامر عند الإشارة بمؤشر الفأرة على العنصر فإنك تستخدم الوصف onmouseenter، وهكذا. والمثال التالي يوضح كيفية كتابة الأكواد بهذه الطريقة.
ثانيا: أكواد داخل الوسم script
وفي هذه الطريقة يتم كتابة الأكواد من خلال إستخدام العنصر (الوسم) script، وهو العنصر المسئول عن تنفيذ أوامر الـ JavaScript داخل ملف الـ HTML، وهذا العنصر لا يظهر محتواه في صفحة الويب كباقي عناصر الـ HTML، حيث أن الإعدادات الإفتراضية لكل متصفحات الويب لهذا العنصر هي display: none; أي أن محتواه مخفي من الصفحة، وبإستخدام العنصر script يمكنك إضافة أكواد الـ JavaScript مباشرة داخل العنصر، أو كتابتها في ملف مستقل وإضافتها من خلال الوصف src، والمثال التالي سوف يوضح طريقة كتابة الأكواد.
عند إستخدام ملف خارجي لأكواد الـ JavaScript، فيجب لإضافته إلى صفحة الـ HTML أن يتم إستخدام الوصف src، وأن يكون العنصر script فارغ (لا يحتوي على أي أكواد بداخله).
يمكنك إضافة العنصر script في أي مكان بداخل صفحة الـ HTML، فيمكنك إضافة العنصر بداخل رأس الصفحة (بداخل العنصر head) أو يمكنك إضافته بداخل صفحة الـ HTML نفسها (بداخل الوسم body)، وهنا يمكنك كتابته في بداية الصفحة أو في نهايتها، ويمكنك إستخدام أكثر من عنصر في أكثر من مكان بداخل صفحة ويب واحدة.
ما هي الأوصاف (attributes) المستخدمة مع العنصر script
الوصف type: وتكون قيمته أي من أنواع الوسائط (media_types)، ويستخدم لتحديد نوع الأكواد الموجودة بداخل العنصر script، حيث يمكنك على سبيل المثال، كتابة أكواد بصيغة json داخل العنصرscript، وبالتالي يستخدم هذا الوصف لتحديد نوع الأكواد المستخدمة، ويعتبر هذا الوصف إجباري في حالة ما إذا كنت تستخدم الإصدار الرابع من لغة الترميز HTML، أما إذا كنت تستخدم الإصدار الخامس فيمكنك تجاهل (عدم كتابته) هذا الوصف، وبصفة شخصية أفضل كتابته أي كان الإصدار المستخدم من لغة الترميز HTML.
الوصف src: وتكون قيمته هي مسار ملف الـ JavaScript أو عنوانه الإلكتروني إذا كانت إستضافة الملف في مكان آخر، ويستخدم هذا الوصف لتحديد مكان الأكواد التي سوف يتم تنفيذها، وفي حالة إستخدام هذا الوصف يجب أن يكون العنصر script فارغ ولا يحتوي على أي أكواد بداخله.
الوصف defer: وتكون قيمته defer، ويستخدم هذا الوصف في حالة إستخدام ملف خارجي للأكواد، أو بمعنى آخر، لكي تستخدم هذا الوصف يجب أن يحتوي العنصر script على الوصف src، ووظيفة هذا الوصف هي أن يعلم المتصفح بأن ينفذ الأوامر الموجودة في الملف بعد الإنتهاء من قراءة وتحميل صفحة الـ HTML.
الوصف async: وتكون قيمته async، وهو أيضا يستخدم فقط في حالة إستخدام ملف خارجي، وأيضا يستخدم فقط إذا كنت تستخدم الإصدار الخامس من لغة الترميز HTML، ويستخدم لكي يتم تنفيذ الأوامر الموجودة في الملف الخارجي بعد الإنتهاء من تحميل الملف، وحتى إذا لم يكمل المتصفح تحميل وقراءة باقي مكونات صفحة الويب.
و بذلك نكون قد تعلمنا كيفية إضافة أكواد الـ JavaScript إلى صفحة الـ HTML، وأتمنى أن أكون قد تمكنت من تبسيط المعلومات، وإذا كان عندك أي إستفسار أو إقتراح بتعديل، فقط إعلمني من خلال التعليقات.
5 سال پیش
در تاریخ 1398/09/02 منتشر شده
است.
7,414
بـار بازدید شده