Tell about the phases of events in a browser. What happens when a user clicks a button?

When a user clicks a button in the browser, several event phases occur:

1. Capturing phase — the event travels from the root down to the target element through the DOM tree, invoking handlers with capture.
2. Target phase — the event reaches the target element, and handlers on the element are invoked.
3. Bubbling phase — the event bubbles back up from the target to the root, invoking handlers without capture.

Thus, when clicking a button, the browser first traverses from the parent elements down to the button, then handles the event on the button itself, and finally bubbles back up.

This allows flexible event handling, such as intercepting events on parent elements or handling them only on the target element.