أمثلة جافا سكريبت
مقدمة عن جافا سكريبت
جافا سكريبت هي لغة برمجة عالية المستوى، تعتبر واحدة من أساسيات تطوير الويب. تتيح هذه اللغة للمطورين إضافة التفاعلية إلى صفحات الويب، مما يحسن تجربة المستخدم بشكل كبير. في هذا المقال، سنستعرض مجموعة من الأمثلة التي توضح كيفية استخدام جافا سكريبت في التطبيقات المختلفة.
مثال 1: تغيير محتوى عنصر HTML
يمكنك استخدام جافا سكريبت لتغيير محتوى عنصر HTML بسهولة. إليك مثالاً بسيطاً:
document.getElementById("myElement").innerHTML = "مرحبا بكم في جافا سكريبت!";
في هذا المثال، نقوم بتغيير النص الموجود في العنصر الذي يحمل المعرف myElement.
مثال 2: إضافة حدث النقر
يمكنك أيضاً استخدام جافا سكريبت لإضافة أحداث مثل النقر على الأزرار. إليك مثال على كيفية القيام بذلك:
document.getElementById("myButton").onclick = function() {
alert("تم النقر على الزر!");
};
في هذا المثال، ستظهر نافذة منبثقة عند النقر على الزر الذي يحمل المعرف myButton.
مثال 3: التحقق من البيانات المدخلة
تعتبر التحقق من البيانات المدخلة جزءًا هامًا من تطوير الويب. إليك مثال يوضح كيفية التحقق من صحة البريد الإلكتروني المدخل:
function validateEmail(email) {
var re = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
return re.test(email);
}
في هذا المثال، نستخدم تعبيراً منتظماً للتحقق مما إذا كان البريد الإلكتروني المدخل صحيحاً أم لا.
مثال 4: إنشاء حلقة تكرارية
يمكنك استخدام حلقات تكرارية لتكرار إجراءات معينة. إليك مثال يستخدم حلقة for:
for (var i = 0; i < 5; i++) {
console.log("العدد هو: " + i);
}
هنا، تقوم الحلقة بطباعة الأعداد من 0 إلى 4 في وحدة التحكم.
مثال 5: استخدام الدوال
تعتبر الدوال جزءاً أساسياً من جافا سكريبت. إليك مثال يظهر كيفية تعريف واستخدام دالة:
function greet(name) {
return "مرحبا، " + name + "!";
}
alert(greet("علي"));
يقوم هذا المثال بتعريف دالة greet التي تأخذ اسم المستخدم وتعيد رسالة ترحيبية.
خاتمة
قدمنا في هذا المقال بعض الأمثلة المباشرة لتوضيح كيفية استخدام جافا سكريبت في تطوير الويب. من خلال هذه الأمثلة، يمكن للمتعلمين والمطورين تحسين مهاراتهم واستخدام جافا سكريبت بفعالية أكبر في مشاريعهم. إن جافا سكريبت هي لغة قوية ومرنة، وتوفر العديد من الإمكانيات للمطورين.