Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript JavaScript and the DOM (Retiring) Traversing the DOM Using parentNode to Traverse Up the DOM

Posted by pacificbee
pacificbee
2,205 Points

What is the event object in this code?

Is it the event target (i.e. BUTTON) that's inside of the if condition? On top of reading the MDN article, I've read through all the treehouse discussions for this video and some of the last and still can't seem to grasp the event object concept. This topic is definitely a mind bender! 

listUl.addEventListener('click', (event)=>{
  if (event.target.tagName == 'BUTTON'){
    let li = event.target.parentNode;
    let ul = li.parentNode;
    ul.removeChild(li);
  }
});

2 Answers

sanjeshwari Nand
seal-mask
.a{fill-rule:evenodd;}techdegree
sanjeshwari Nand
Full Stack JavaScript Techdegree Student 4,673 Points
sanjeshwari Nand
.a{fill-rule:evenodd;}techdegree
sanjeshwari Nand
Full Stack JavaScript Techdegree Student 4,673 Points

when any event occurs, an event object is automatically created. The event object contains relevant data about the event that took place, and we can use the event object passed into the event handler to retrieve this information.This can be confusing to understand and i found this YouTube video to be VERY helpful : https://www.youtube.com/watch?v=C9Ad3420Kmw

M C
M C
12,105 Points
M C
M C
12,105 Points

You can try to console.log(event) before the if statement. Then check the browser console and dig through the properties that are returned.

Depending on where you click you will get different values in the properties. I think you should not focus on what the event object is but rather what the event.target returns.