কম্পিউটার টিউটোরিয়াল

HTML DOM addEventListener() মেথড

HTML DOM addEventListener() মেথড নির্দিষ্ট এলিমেন্টে একটি ইভেন্ট হ্যান্ডলার আটাচ করতে ব্যবহৃত হয়।

সিনট্যাক্স নিচের মতো:

element.addEventListener(event, function, capture)

উপরে, প্যারামিটারগুলো شامل:

  • event: ইভেন্টের নাম। আবশ্যক।
  • function: ইভেন্ট ঘটলে চালানোর ফাংশন। আবশ্যক।
  • capture: ইভেন্ট ক্যাপচারিং ফেজে এক্সিকিউট হবে কিনা। এটি বুলিয়ান ভ্যালু চেক করে এবং প্রদর্শন করে; true বা false।

আইএ এখন DOM addEventListener() মেথড ইমপ্লিমেন্ট করার একটি উদাহরণ দেখি:

উদাহরণ

<!DOCTYPE html> <html> <body> <h2>Demo Heading</h2> <button id="btn">Click</button> <p id="myid"></p> <script> var x = document.getElementById("btn"); x.addEventListener("mouseover", one); x.addEventListener("click", two); function one() { document.getElementById("myid").innerHTML += "Button hovered! " } function two() { document.getElementById("myid").innerHTML += "!!Button Clicked!! " } </script> </body> </html>

আউটপুট

HTML DOM addEventListener() মেথড

এখন, আপনি ক্লিক করলে, "Button clicked" মেসেজটি প্রদর্শিত হবে। বাটনে মাউস হোভার করলে নিচের টেক্সট প্রদর্শিত হবে: "Button hovered" :

HTML DOM addEventListener() মেথড

  1. HTML DOM Storage setItem() মেথড

  2. HTML DOM Storage getItem() মেথড

  3. HTML DOM Storage Event

  4. HTML DOM stopPropagation() ইভেন্ট মেথড