Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

JavaScript jQuery Basics Understanding jQuery Events and DOM Traversal The Event Object

'this' vs. 'event.target'

Whats the difference?

1 Answer

andren
andren
28,524 Points

this within a jQuery event handler maps to event.currentTarget for direct event handlers, and usually event.target for delegated event handlers. The event handler shown in this video is a delegated handler.

The difference between currentTarget and target is that currentTarget will always refer to the element that the event listener is attached to, the p elements with the spoiler class in this case. Whereas target refers to the specific element that actually triggered the event, which in this case is the button element inside the p element.

So in this video this and event.target points to the same element, the button element.

Edit: This answer was edited after the fact to correct for the fact that I did not account for the difference between direct and delegated event handlers.