I don't really understand the DOM standard Event object

Question

right now I'm trying to learn JavaScript with the book "Beginning JavaScript 5th Edition" and because english is not my native language it's sometimes hard to understand.

Right now I'm a bit confused with the so called DOM standard Event object .

function handleEvent(e) {
  var target = e.target; 
  var type = e.type;


  if (target.tagName == "P") { 
    if (type == "mouseover") {
      target.className = "underline"; } else if (type == "mouseout") {
      target.className = ""; }
 } 
};

Is e just a convention for a parameter that I could give any name I want ? For example y ?

Can I think of .target as the same as .this ?

.target references to my element on which an event occurs, right ?

Answer 1

e is just a convention for the parameter, and so is event . Because e has all the event propertys. Try outputting e in your console, and you'll see all the values it has. (Btw, e is just an object as you'll see in your console.)

In your handleEvent function, just add console.log(e) to see everything it has.

e.target is the element which the event is called on. And e.type is the event type. If you switch e to event things might become clearer to you.

Answer 2

e is indeed just a convention, so you could give it any name you want. .target is de element that fires the event, so its the element where you attached the event to.

Answer 3

Yes. e is the standard variable name given to the event object. That variable name could be anything.