Using this inside an event handler

by

Indeed, the Definitive Guide is wrong in that case.

I found a reference in the HTML5 event handler processing algorithm:

Invoke callback with one argument, the value of which is the Event object E, with the callback this value set to E‘s currentTarget.

The DOM level 3 event specification didn’t say much about it in previous versions – it was meant to be language agnostic. The Appendix F: ECMAScript Language Binding just stated

EventListener function:
This function has no return value. The parameter shall be an object that implements the Event interface.

However, current versions omitted these bindings. And in its Glossary appendix event listeners are described:

event handler, event listener: An object that implements the EventListener interface and provides an EventListener.handleEvent() callback method. Event handlers are language-specific. Event handlers are invoked in the context of a particular object (the current event target) and are provided with the event object itself.

Also, the upcoming DOM Level 4 draft, whose goals contain aligning the DOM with the needs of EcmaScript, does explicitly state in the Dispatching Events section:

If listener‘s callback is a Function object, its callback this value is the event‘s currentTarget attribute value.

More Related Contents:

  1. How to make JavaScript execute after page load?
  2. onKeyPress Vs. onKeyUp and onKeyDown
  3. Firing event on DOM attribute change
  4. Event when window.location.href changes
  5. Why is the DOMSubtreeModified event deprecated in DOM level 3?
  6. Manipulating innerHTML removes the event handler of a child element? [duplicate]
  7. How do I programmatically click on an element in JavaScript?
  8. Adding an onclick event to a table row
  9. Pass mouse events through absolutely-positioned element
  10. Unable to understand useCapture parameter in addEventListener
  11. Change ‘s option and trigger events with JavaScript
  12. ES6 Class: access to ‘this’ with ‘addEventListener’ applied on method [duplicate]
  13. Native JS equivalent to jQuery delegation
  14. Are event handlers in JavaScript called in order?
  15. HTML DOM: Which events do not bubble?
  16. Do I need to remove event listeners before removing elements?
  17. link element onload
  18. Wait for iframe to load in JavaScript
  19. event.toElement in IE8 and Firefox?
  20. cloning javascript event object
  21. Is there any way of passing additional data via custom events?
  22. How browser executes Javascript and renders asynchronously
  23. In web browsers, what’s the difference between onblur and onfocusout?
  24. Replacement for deprecated `keypress` DOM event
  25. Manually dispatchEvent DOMContentLoaded
  26. Detect Click into Iframe using JavaScript
  27. Is there any way to accelerate the mousemove event?
  28. JavaScript: Is it better to use innerHTML or (lots of) createElement calls to add a complex div structure? [duplicate]
  29. Accessing a DOM object defined in an external SVG file
  30. Create a table in SVG

Leave a Comment