focus 메서드

focus 메서드는 요소(주로 input)에 포커스를 설정합니다. 이는 해당 input에 커서가 깜박이기 시작하고 키보드로 입력하는 텍스트가 정확히 이 input에 들어감을 의미합니다.

구문

요소.focus();

예시

한 버튼을 클릭하면 input에 포커스를 설정하고, 다른 버튼을 클릭하면 포커스를 제거해 봅시다:

<input value="text" id="input">
<input type="button" value="focus" id="focus">
<input type="button" value="blur"  id="blur">

let input = document.querySelector('#input');
let focus = document.querySelector('#focus');
let blur  = document.querySelector('#blur');

// focus 버튼 클릭 시 input에 포커스 설정:
focus.addEventListener('click', function() {
	input.focus();
});

// blur 버튼 클릭 시 input에서 포커스 제거:
blur.addEventListener('click', function() {
	input.blur();
});

함께 보기

요소에서 포커스를 제거할 수 있는 메서드 blur