Η ιδιότητα event.target

Η ιδιότητα event.target περιέχει το στοιχείο, στο οποίο ενεργοποιήθηκε το συμβάν. Δεν είναι αυτό το στοιχείο, στο οποίο ήταν δεμένος ο χειριστής αυτού του συμβάντος, αλλά ακριβώς η πιο βαθιά ετικέτα, στην οποία άμεσα είχε, για παράδειγμα, γίνει κλικ.

Σύνταξη

javascriptevent.target;

Παράδειγμα

Ας υποθέσουμε ότι έχουμε ένα div, και μέσα σε αυτό μια παράγραφο. Θα δέσουμε ένα συμβάν στο div, αλλά θα κάνουμε κλικ στην παράγραφο - σε αυτή την περίπτωση το event.target θα περιέχει την τελική ετικέτα, στην οποία συνέβη το συμβάν - δηλαδή την παράγραφο, και όχι το div. Ας το επιβεβαιώσουμε με τη βοήθεια του tagName:

html<div id="div">
  <p>κείμενο</p>
</div>
javascriptlet div = document.querySelector('#div');

div.addEventListener('click', function(event) {
  console.log(event.target); // θα εμφανίσει την αναφορά στην παράγραφο
});

Δείτε επίσης

  • η ιδιότητα event.currentTarget,
    που περιέχει το στοιχείο, στο οποίο είναι δεμένο το συμβάν
  • η ιδιότητα code,
    που λαμβάνει τον κωδικό του πλήκτρου που πατήθηκε
  • η ιδιότητα event.key,
    που λαμβάνει τον χαρακτήρα που εισήχθη