Урок 3.1Урок 12 з 24

Події та їхнє поширення

Given a business requirement, utilize Events, event handlers, and propagation.

Головне

1Клік проходить три фази: перехоплення — від window вниз до цільового елемента, сам цільовий елемент, а потім спливання назад угору до window.
2За замовчуванням слухачі спрацьовують у фазі спливання. Щоб слухач спрацьовував у фазі перехоплення, передайте третім аргументом true або { capture: true }.
3stopPropagation зупиняє подію на її шляху, тож елементи, що йдуть далі, її не отримують. preventDefault скасовує дію браузера за замовчуванням, наприклад перехід за посиланням або надсилання форми.
4removeEventListener потребує того самого посилання на функцію і того самого прапорця capture. Сигнал AbortController знімає багато слухачів одним викликом abort.
5new CustomEvent(type, { detail, bubbles }) передає дані; dispatchEvent викликає слухачів синхронно й повертає false, якщо слухач скасував подію, яку можна скасувати.

Що перевіряє іспит із цієї теми

Формулювання з програми іспиту (англійською).

3.1.K1addEventListener options, removeEventListener, the event object
3.1.K2Capturing and bubbling, stopPropagation, preventDefault, event delegation
3.1.K3Custom events: CustomEvent and dispatchEvent
3.1.S1Choose the handler setup that reacts to the right events in the right order

Дайте відповідь на запитання за сценаріями з цієї теми. До кожного варіанта є розбір.