速答：
focusin与focusout事件会冒泡。
focus与blur事件不会冒泡。
什么元素能够focus
默认情况并不是所有元素都能获得焦点。需要满足以下条件之一：
- 可交互的元素（如
input,select,a）。换言之，默认情况下，用于布局的元素（如div,span,table）则不能获得焦点 - 含有
tabindex属性的元素
当我们想令非可交互元素获得焦点，可以为其设置tabindex属性。
tabindex属性
tabindex属性接收一个number作为参数，代表按下键盘Tab键时focus元素切换的顺序。
他的规则如下：
- 当
tabindex大于等于1，切换时按tabindex从小到大的顺序 - 当
tabindex等于0，则tabindex大于等于1的元素切换完后再切换到该元素 - 当
tabindex小于0，不能通过Tab切换到该元素，但是可以通过elem.focus()使该元素获得焦点 - 当多个元素
tabindex相同，以元素在HTML代码中出现的顺序为准
例子
代码语言：javascript复制<ul>
<li tabindex="1">1</li>
<li tabindex="0">0</li>
<li tabindex="2">2</li>
<li tabindex="-1">-1</li>
</ul>例子中到代码通过Tab切换时，获得焦点的元素依次为1 - 2 - 0。
focusin/focusout
focus与blur事件不会冒泡。如果想实现事件代理可以通过允许捕获实现。
<form id="form">
<input type="text" name="name" value="Name">
<input type="text" name="surname" value="Surname">
</form>
<script>
// addEventListener第三个参数true，允许捕获
form.addEventListener("focus", () => form.classList.add('focused'), true);
form.addEventListener("blur", () => form.classList.remove('focused'), true);
</script>如果想在冒泡阶段实现事件代理，可以使用focusin与focusout事件替代。
document.activeElement指向当前获得焦点的元素。
