JavaScript Event currentTarget Property

Beginner
5 min read
Updated: Nov 2026
3 examples
Property
Decorative image with the word CURRENTTARGET

Definition

Event.currentTarget is a read-only EventTarget that identifies the object to which the current event handler is attached (MDN). It is not always the same as event.target, which is where the event first fired (often a child that bubbled up).

Read the notes below before you rely on this property. Prefer feature detection when support is limited.

Syntax

Use event.currentTarget. Start with this line.

JavaScript
event.currentTarget
CallWhat it does
event.currentTargetPrimary signature.

Built into the browser. Read event.currentTarget on an Event instance — no import required.

Library declarations
JavaScript
event.currentTarget

Parameters

This member has no parameters beyond those shown in the signature.

Return Value

Return ValueDescription
*The current value of event.currentTarget.

JavaScript Examples

Example 1 — Read currentTarget

Log the element that owns the click listener.

JavaScript
document.getElementById("btn").addEventListener("click", (event) => {
  console.log(event.currentTarget.id); // "btn"
});
Try It Yourself

How It Works

  1. Bind the listener. The handler is attached to the button with id btn.
  2. Click fires. The browser calls your listener with an Event.
  3. Read currentTarget. It is that same button → "btn".
  4. Arrow-safe. Prefer event.currentTarget over this in arrow functions.

Example 2 — currentTarget vs target

MDN pattern: listener on the parent; click the child and compare both properties.

JavaScript
const parent = document.getElementById("parent");

parent.addEventListener("click", (event) => {
  console.log(event.currentTarget.id); // "parent"
  console.log(event.target.id);        // "child" when child is clicked
});
Try It Yourself

How It Works

  1. Listener on parent. Only the parent has the handler.
  2. Click the child. The event starts on the child, then bubbles.
  3. currentTarget. Still the parent — where the listener is attached.
  4. target. The child — where the click originated. This is the core of event delegation.

Example 3 — null Outside the Handler

MDN: currentTarget is only set while the handler is running.

JavaScript
let saved = null;

document.getElementById("btn").addEventListener("click", (event) => {
  saved = event;
  console.log(event.currentTarget !== null); // true
});

document.getElementById("check").addEventListener("click", () => {
  console.log(saved && saved.currentTarget); // null after the first handler finished
});
Try It Yourself

How It Works

  1. During the click handler. currentTarget points at the button.
  2. Save the Event. Storing event does not freeze currentTarget.
  3. Later click. Reading saved.currentTarget outside that handler yields null.
  4. Rule. Copy what you need (id, element reference) inside the handler if you need it later.
Compatibility

Browser Support

Event.currentTarget is marked Baseline Widely available on MDN (since July 2015). It is also available in Web Workers.

✓ Baseline · Widely available

Event.currentTarget

Read-only EventTarget: the object to which the current event handler is attached. Supported across modern browsers and legacy IE.

100% Widely available
Google Chrome All versions · Desktop & Mobile
Full support
Mozilla Firefox All versions · Desktop & Mobile
Full support
Apple Safari All versions · macOS & iOS
Full support
Microsoft Edge All versions · Chromium & Legacy
Full support
Internet Explorer IE 6+ · Legacy environments
Full support
Opera All modern versions
Full support
Event.currentTarget Excellent

Bottom line: Safe to use everywhere. Read event.currentTarget inside the handler for the bound element; use event.target for the origin. Remember it becomes null after the handler finishes.

Frequently Asked Questions

It is a read-only property that identifies the EventTarget (usually an element) to which the current event handler is attached—not necessarily the element that was clicked or fired on.
No. MDN marks Event.currentTarget as Baseline Widely available (since July 2015). It is not Deprecated, Experimental, or Non-standard. It is also available in Web Workers.
event.target is where the event originated (for example the child that was clicked). event.currentTarget is the element that has this listener. With bubbling and delegation they often differ.
MDN notes that currentTarget is only available inside an event handler. If you save the Event object and read currentTarget later outside the handler, it is null.
Use it when your listener is on a parent (delegation) and you need a stable reference to that parent, or when you want the element the handler was bound to rather than a nested click target.
For a normal function listener registered with addEventListener, this usually equals event.currentTarget. Arrow functions do not get their own this, so prefer event.currentTarget there.

Next: defaultPrevented

Learn how to tell whether preventDefault() canceled the default action.

defaultPrevented tutorial →

About the author

Mari Selvan M P
Mari Selvan M P 🔗

Developer, cloud engineer, and technical writer

  • Experience 12 years building web and cloud systems
  • Focus Full Stack Development, AWS, and Developer Education

I write practical tutorials so students and working developers can learn by doing—from databases and APIs to deployment on AWS.

AWS Certified Developer – Associate (Credly)

10 people found this page helpful

JavaScript Event composed Property JavaScript Event defaultPrevented Property