Merge pull request #3176 from davidshq/patch-3

Update article.md
This commit is contained in:
Ilya Kantor 2022-09-20 13:55:16 +02:00 committed by GitHub
commit 83b7de0b79
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -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