El documento de MDN explicó el manejo de eventos en todos los navegadores modernos manejados en tres fases que son:
1.capturing phase -->(top most to target parent) 2.target phase -->(element on where event happened) 3.the bubbling phase -->(target parent to top most element)y después de leer todo este documento, lo que entiendo es que estas tres fases son independientes entre sí, pero esta demostración me confunde. porque aquí el evento de destino se dispara dos veces , no entiendo por qué esto no se dispara solo una vez o se dispara con respecto a la fase de captura y burbujeo no independiente.
Hay dos detectores de eventos adjuntos a cada div en el código, uno para burbujear y otro para capturar. Por lo tanto, obtendrá dos resultados en el nivel objetivo, uno de cada evento.
Normalmente, al escribir código, elegiría agregar un detector de eventos para burbujear o capturar, no para ambos, por lo que solo vería un evento dispararse en el nivel de destino.
