> 웹 프론트엔드 > JS 튜토리얼 > JavaScript에서 현재 초점을 맞춘 DOM 요소를 어떻게 확인할 수 있나요?

JavaScript에서 현재 초점을 맞춘 DOM 요소를 어떻게 확인할 수 있나요?

Mary-Kate Olsen
풀어 주다: 2024-12-03 14:55:12
원래의
201명이 탐색했습니다.

How Can I Determine the Currently Focused DOM Element in JavaScript?

JavaScript에서 포커스가 있는 요소 결정

현재 포커스를 갖고 있는 DOM 요소를 찾는 것은 다양한 사용자 인터페이스에 유용한 작업이 될 수 있습니다. 상호 작용.

document.activeElement

이 문제에 대한 해결책은 document.activeElement 속성에 있습니다. 포커스를 유지하는 DOM 요소에 대한 참조를 제공합니다. 이 속성은 최신 브라우저에서 지원되므로 JavaScript 프로젝트를 위한 안정적인 솔루션이 됩니다.

구현

document.activeElement를 실제로 사용하려면 포커스가 있는 요소를 검색할 수 있습니다. 예를 들면 다음과 같습니다:

const focusedElement = document.activeElement;
로그인 후 복사

현재 포커스가 있는 요소에 대한 참조를 제공하여 해당 요소를 조작하거나 필요한 작업을 수행할 수 있습니다.

추가 고려 사항

이전 브라우저에서는 어떤 양식 필드에 포커스가 있는지 감지하는 것이 간단하지 않았습니다. 해결 방법으로 모든 필드에 "focus" 및 "blur" 이벤트 핸들러를 할당하여 변수에서 마지막으로 포커스가 맞춰진 요소를 추적할 수 있습니다. "blur" 핸들러는 포커스를 잃으면 이 변수를 지웁니다.

활성 요소 흐리게

활성 요소에 대한 참조가 있으면 흐림을 사용할 수 있습니다. 포커스를 제거하는 방법입니다. 이는 프로그래밍 방식으로 포커스를 다른 요소로 이동해야 할 때 유용할 수 있습니다.

document.activeElement.blur();
로그인 후 복사

이렇게 하면 포커스가 body 요소로 다시 전송됩니다.

관련 리소스

  • [액티브엘리먼트 브라우저 호환성](https://developer.mozilla.org/en-US/docs/Web/API/document.activeElement#Browser_compatibility)
  • [document.activeElement에 대한 jQuery 대안](https://stackoverflow. com/questions/9508980/jquery-alternative-for-document-activeelement)

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

원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿