Разница между событиями focus и focusin/focusout в JavaScript заключается в их поведении и распространении внутри структуры DOM. 5

Focus происходит, когда элемент получает фокус. 24 Это «опускающиеся» события, то есть они распространяются до корневого элемента DOM. 5 Они используются, чтобы определить, когда элемент получает или теряет фокус, независимо от того, где это событие происходит в иерархии DOM. 5

Focusin и focusout считаются «контейнерными событиями». 5 Они специфичны для элементов, которые служат контейнерами. 5 Эти события сообщают контейнеру, что фокус входит или покидает сам контейнер, а не только элемент внутри него. 5

Таким образом, focus и blur используются для общих событий, связанных с фокусом, и распространяются до корневого элемента DOM, а focusin и focusout — это контейнерные события, которые информируют контейнер о входе или выходе фокуса из него самого, а не только элемента внутри него. 5