15. DOM Events
📘 কনসেপ্ট (থিওরি)
জাভাস্ক্রিপ্ট HTML ইভেন্টে সাড়া দিতে পারে। ইভেন্ট ঘটে যখন ইউজার পেজের সাথে ইন্টারঅ্যাক্ট করে (যেমন বোতাম ক্লিক করা, টাইপ করা, হোভার করা)।
ইভেন্ট শোনার জন্য, আমরা
addEventListener() ব্যবহার করি। এটি দুটি আর্গুমেন্ট নেয়: ইভেন্টের নাম এবং ইভেন্ট ঘটলে কোন ফাংশন চলবে তা।
element.addEventListener("event_name", function_to_run);
**প্রচলিত ইভেন্ট:**
-
click — ইউজার যখন ক্লিক করে
- mouseover / mouseout — মাউস ঢুকলে/বেরোলে
- keyup / keydown — কি-বোর্ডে চাপ দিলে
- submit — ফর্ম সাবমিট হলে💡 উদাহরণ
ইভেন্ট লিসেনার উদাহরণ (সিনট্যাক্স):
const button = document.getElementById("btn");
// ক্লিক হলে অ্যারো ফাংশন চলবে
button.addEventListener("click", () => {
console.log("Button was clicked!");
document.body.style.backgroundColor = "lightblue";
});
🎯 আপনার কাজ (প্র্যাকটিস)
ধরুন একটি
btn এলিমেন্ট আছে। এতে একটি "click" ইভেন্ট লিসেনার যোগ করার সিনট্যাক্স লিখুন যা কনসোলে "Clicked!" লগ করবে।main.javascript
Loading...
OUTPUT
Run your code to see the output here...