HTML의 tabindex 속성에서 tabindex="-1"을 설정하면 어떤 동작을 하나요?

Q: HTML의 tabindex 속성에서 tabindex="-1"을 설정하면 어떤 동작을 하나요?

Tab 키로는 포커스되지 않지만, JavaScript의 focus()로는 포커스할 수 있다 tabindex="-1"은 Tab 키 탐색 순서에서 제외되지만, JavaScript의 element.focus() 메서드로 프로그래밍적으로 포커스할 수 있습니다. 모달 다이얼로그나 동적 콘텐츠에 포커스를 이동시킬 때 자주 사용됩니다.

보통 MDN Web Docs

보기 및 정답

A Tab 키로는 포커스되지 않지만, JavaScript의 focus()로는 포커스할 수 있다

B 모든 방법으로 포커스가 불가능해지며 스크린 리더에서도 완전히 무시되는 상태가 된다

C 가장 먼저 Tab 포커스를 받으며 다른 모든 요소보다 우선순위가 높아지는 효과가 있는 것으로 알려져 있다

D Tab 키의 순서가 역순이 되어 마지막 요소부터 첫 번째 요소 순서로 이동하게 된다

해설

tabindex="-1"은 Tab 키 탐색 순서에서 제외되지만, JavaScript의 element.focus() 메서드로 프로그래밍적으로 포커스할 수 있습니다. 모달 다이얼로그나 동적 콘텐츠에 포커스를 이동시킬 때 자주 사용됩니다.

코딩, 제대로 배우고 싶다면?

개념 확인은 퀴즈로, 실력은 실전 프로젝트로.
투더제이 코딩클래스에서 시작하세요.

정규반 살펴보기

HTML의 tabindex 속성에서 tabindex="-1"을 설정하면 어떤 동작을 하나요?

해설

코딩, 제대로 배우고 싶다면?

관련 문제

시장과 사람의 답을 봤다면,다음 결과물의 구조를 고릅니다.

시장과 사람의 답을 봤다면,
다음 결과물의 구조를 고릅니다.