JavaScript에서 현재 초점을 맞춘 DOM 요소를 어떻게 식별할 수 있습니까?

JavaScript에서 포커스가 있는 DOM 요소 식별

어떤 DOM 요소에 포커스가 있는지 알아내는 것은 사용자 경험을 향상하고 요소 상호 작용을 제어하는 ​​데 중요합니다. JavaScript에서는 document.activeElement 속성을 사용하여 이를 수행할 수 있습니다.

document.activeElement 사용

document.activeElement는 문서에서 현재 포커스가 있는 요소를 나타냅니다. 입력 필드, 텍스트 영역 또는 버튼과 같이 활성 포커스가 있는 요소를 반환합니다. 이 속성은 모든 주요 브라우저에서 지원됩니다.

예:

const focusedElement = document.activeElement;
console.log("Focused element:", focusedElement.tagName);

이전 브라우저에 대한 대체 접근 방식

In 이전 브라우저에는 초점이 맞춰진 요소를 결정하는 직접적인 방법이 없었습니다. 이 감지를 에뮬레이트하기 위해 "포커스" 및 "흐림"에 대한 이벤트 핸들러를 모든 양식 필드에 추가할 수 있습니다. 필드에 포커스가 생기면 해당 참조를 변수에 저장할 수 있습니다. 반대로 필드가 포커스를 잃으면 변수를 지울 수 있습니다.

Blurring ActiveElement

activeElement를 제거하려면 Blur() 메서드를 사용할 수 있습니다. . 이렇게 하면 activeElement가 본문 요소로 변경됩니다.

document.activeElement.blur();

추가 리소스

• [activeElement 브라우저 호환성](https://developer.mozilla.org/en-US/docs/Web/API/Document/activeElement)
• [document.activeElement에 대한 jQuery 대안](https://api.jquery. com/jQuery.fn.prop/)

위 내용은 JavaScript에서 현재 초점을 맞춘 DOM 요소를 어떻게 식별할 수 있습니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!