在焦点事件期间,我对document.activeElement
的值感到困惑。考虑以下示例:
/*
* 1. Click on button to focus it
* 2. Press TAB
*/
const div = document.querySelector('div')
const add = div.addEventListener.bind(div)
add('keydown', () => console.log('Key down', document.activeElement), false)
add('keyup', () => console.log('Key up', document.activeElement), false)
add('focusout', () => console.log('Focus out', document.activeElement), false)
add('focusout', () => requestAnimationFrame(() => console.log('rAF Focus out', document.activeElement)), false)
<div>
<button>Click</button>
<input>
</div>
结果是:
Key down <button>Click</button>
Focus out <body>…</body>
rAF Focus out <input></input>
Key up <input></input>
我特别想知道为什么在document.activeElement
中将body
设置为focusout
?