commit
83b7de0b79
1 changed files with 5 additions and 5 deletions
|
@ -261,7 +261,7 @@ input.removeEventListener("click", handler);
|
|||
Please note -- if we don't store the function in a variable, then we can't remove it. There's no way to "read back" handlers assigned by `addEventListener`.
|
||||
````
|
||||
|
||||
Multiple calls to `addEventListener` allow to add multiple handlers, like this:
|
||||
Multiple calls to `addEventListener` allow it to add multiple handlers, like this:
|
||||
|
||||
```html run no-beautify
|
||||
<input id="elem" type="button" value="Click me"/>
|
||||
|
@ -288,7 +288,7 @@ As we can see in the example above, we can set handlers *both* using a DOM-prope
|
|||
````warn header="For some events, handlers only work with `addEventListener`"
|
||||
There exist events that can't be assigned via a DOM-property. Only with `addEventListener`.
|
||||
|
||||
For instance, the `DOMContentLoaded` event, that triggers when the document is loaded and DOM is built.
|
||||
For instance, the `DOMContentLoaded` event, that triggers when the document is loaded and the DOM has been built.
|
||||
|
||||
```js
|
||||
// will never run
|
||||
|
@ -334,10 +334,10 @@ Some properties of `event` object:
|
|||
`event.currentTarget`
|
||||
: Element that handled the event. That's exactly the same as `this`, unless the handler is an arrow function, or its `this` is bound to something else, then we can get the element from `event.currentTarget`.
|
||||
|
||||
`event.clientX / event.clientY`
|
||||
`event.clientX` / `event.clientY`
|
||||
: Window-relative coordinates of the cursor, for pointer events.
|
||||
|
||||
There are more properties. Many of them depend on the event type: keyboard events have one set of properties, pointer events - another one, we'll study them later when we come to different events in details.
|
||||
There are more properties. Many of them depend on the event type: keyboard events have one set of properties, pointer events - another one, we'll study them later when as we move on to the details of different events.
|
||||
|
||||
````smart header="The event object is also available in HTML handlers"
|
||||
If we assign a handler in HTML, we can also use the `event` object, like this:
|
||||
|
@ -373,7 +373,7 @@ For instance:
|
|||
|
||||
As we can see, when `addEventListener` receives an object as the handler, it calls `obj.handleEvent(event)` in case of an event.
|
||||
|
||||
We could also use a class for that:
|
||||
We could also use a class (although we still have to instantiate it as an object):
|
||||
|
||||
|
||||
```html run
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue