المفاهيم الأساسية:
- عنصر الحدث: كائن في جافاسكربت يمثل حدثًا وقع على عنصر HTML.
- الهدف: العنصر المستهدف الذي حدث فيه الحدث.
- النوع: نوع الحدث الذي وقع، مثل "click" أو "keydown".
- preventDefault: طريقة لمنع الحدث الافتراضي من الحدوث.
- stopPropagation: طريقة لوقف انتشار الحدث إلى عناصر الوالد.
- معلومات الحدث: بيانات إضافية حول الحدث، مثل إحداثيات الماوس أو قيمة المفتاح المضغوط.
الخطوات العملية:
- حدد عنصر HTML الذي تريد الاستماع إلى الأحداث فيه.
- أضف مستمع حدث إلى العنصر باستخدام طريقة "addEventListener".
- حدد دالة الرد التي سيتم استدعاؤها عند حدوث الحدث.
- في دالة الرد، يمكنك الوصول إلى عنصر "الحدث" الذي يحتوي على معلومات الحدث.
- استخدم طرق مثل "preventDefault" و "stopPropagation" لتعديل سلوك الحدث حسب الحاجة.
مثال جافاسكربت:
const button = document.querySelector("button");
button.addEventListener("click", (event) => {
console.log("حدث النقر:");
console.log("الهدف:", event.target);
console.log("النوع:", event.type);
console.log("إحداثيات الماوس:", event.clientX, event.clientY);
});
ملاحظة للمتحدثين باللغة العربية:
هذا الدليل يهدف إلى تحسين إمكانية الوصول والاستخدام. يرجى عدم التردد في مشاركة اقتراحاتكم حول كيفية تحسين هذا الدليل بشكل أكبر لمتحدثي اللغة العربية.