document.activeElement
문서 자체에 초점을 맞추지 않은 경우에도 여전히 요소를 반환 할 수 있습니다 (따라서 문서에 아무것도 초점이 맞지 않습니다 !)
당신 은 그 행동을 원할 수도 있고 (예를 들어 이벤트 내에서 ) 중요하지 않을 수도keydown
있지만, 실제로 어떤 것이 집중되어 있는지 알아야하는 경우 추가로 확인할 수 있습니다 document.hasFocus()
.
다음은 포커스가있는 요소가있는 경우 또는 다른 요소를 제공합니다 null
.
var focused_element = null;
if (
document.hasFocus() &&
document.activeElement !== document.body &&
document.activeElement !== document.documentElement
) {
focused_element = document.activeElement;
}
특정 요소에 초점이 있는지 확인하려면 더 간단합니다.
var input_focused = document.activeElement === input && document.hasFocus();
여부를 확인하려면 아무것도가 초점을 맞추고, 다시 더 복잡하다 :
var anything_is_focused = (
document.hasFocus() &&
document.activeElement !== null &&
document.activeElement !== document.body &&
document.activeElement !== document.documentElement
);
견고성 참고 : document.body
및 에서 검사하는 코드에서 document.documentElement
일부 브라우저는이 중 하나를 반환하거나 null
포커스가 없을 때입니다.
<body>
(또는 아마도 <html>
) tabIndex
속성 이 있었는지 실제로 초점을 맞출 수 있는지에 대해서는 설명하지 않습니다 . 라이브러리 나 무언가를 작성하고 있고 강력하게하려면, 어떻게 든 처리해야합니다.
여기 에 집중 요소를 얻는 ( 큰 따옴표) "한 줄짜리"버전이 있습니다. 단락에 대해 알아야하기 때문에 개념적으로 더 복잡 합니다. 읽을 수 있기를 원합니다.
나는 이것을 추천하지 않을 것이다. 그러나 당신이 1337 hax0r이라면, idk ... 거기 있습니다. 경우에 따라 신경 쓰지 않아도 부품
을 제거 할 수도 있습니다. (당신은 여전히 얻을 수 있는 경우 입니다 ) :|| null
false
null
document.activeElement
null
var focused_element = (
document.hasFocus() &&
document.activeElement !== document.body &&
document.activeElement !== document.documentElement &&
document.activeElement
) || null;
특정 요소에 초점이 맞춰져 있는지 확인 하려면 이벤트를 사용할 수도 있지만이 방법을 사용하려면 설정 (및 잠재적 인 분해)이 필요하며 , 초기 상태는 다음과 같습니다.
var input_focused = false;
input.addEventListener("focus", function() {
input_focused = true;
});
input.addEventListener("blur", function() {
input_focused = false;
});
비 이벤트 방식을 사용하여 초기 상태 가정을 수정할 수 있지만 대신 대신 사용할 수도 있습니다.