Event Listener और Bubbling

addEventListener

एक handler फ़ंक्शन जोड़ें जो event होने पर चलता है।

const btn = document.querySelector("button");
btn.addEventListener("click", (event) => {
  console.log("Clicked!", event.target);
});

Event ऑब्जेक्ट

हर handler को एक event ऑब्जेक्ट मिलता है — event.target असली क्लिक किया गया एलिमेंट है, और event.preventDefault() ब्राउज़र के डिफ़ॉल्ट व्यवहार को रोकता है।

Event Bubbling

Events target एलिमेंट से उसके पूर्वजों तक ऊपर bubble होते हैं — किसी बटन पर क्लिक उसके parent div के listener को भी चलाता है, जब तक event.stopPropagation() से न रोका जाए।

त्वरित जाँच: event.preventDefault() क्या करता है?

• Event को bubble होने से रोकता है
• उस event के लिए ब्राउज़र की डिफ़ॉल्ट क्रिया रोकता है
• Event listener को हटा देता है