विभिन्न * लक्ष्य गुणों का उद्देश्य क्या है?

Question

MouseEvent वर्ग में वहाँ रहे हैं कई * लक्ष्य घटनाओं:

• target
• currentTarget
• relatedTarget

एक MouseEvent के संदर्भ में उनके उद्देश्य क्या है?

Answer 1

ये गुण जावास्क्रिप्ट माउस घटनाओं के बराबर हैं। जावास्क्रिप्ट घटनाएं डीओएम को पार करती हैं (जिसे "बबलिंग" कहा जाता है)। target वह ऑब्जेक्ट है जिस पर ईवेंट मूल रूप से प्रेषित किया गया था। currentTarget वह ऑब्जेक्ट है जिस पर आपका ईवेंट हैंडलर संलग्न किया गया है।

उदाहरण

आप इस HTML संरचना है:

<ul id="list"> 
    <li>Entry 1</li> 
    <li>Entry 2</li> 
</ul> 

और आप <ul> तत्व (या तो जावास्क्रिप्ट या डार्ट के माध्यम से, अवधारणा ही है) के लिए एक क्लिक हैंडलर जोड़ने।

जब आप "एंट्री 2" पर क्लिक करते हैं, तो आपके क्लिक हैंडलर को कॉल किया जाएगा (क्योंकि ईवेंट "इसे" बुलबुले "करता है)। target<li> तत्व होगा, जबकि currentTarget<ul> तत्व होगा। आपको किसके लिए उपयोग करना है, उस पर निर्भर करता है कि आप अपने हैंडलर में क्या करना चाहते हैं - उदाहरण के लिए, आप target, या currentTarget का उपयोग कर पूरी सूची "एंट्री 2" को छुपा सकते हैं।

relatedTarget द्वारा संदर्भित तत्व आपके MouseEvent के प्रकार पर निर्भर करता है - एक सूची यहां पाई जा सकती है: event.relatedTarget। उपर्युक्त उदाहरण में, यह null होगा, क्योंकि ईवेंट पर क्लिक करने से कोई संबंधित लक्ष्य नहीं है।

संबंधित MDN लिंक: event.currentTarget, event.target