Métodos focus e blur em JavaScript

Você já sabe o que é foco de entrada. Você também sabe como definir ou perder o foco: para definir, é necessário clicar no campo de entrada, e para perder - clicar em algum outro lugar.

Em JavaScript, no entanto, existem métodos especiais que permitem definir forçosamente o foco em um input ou removê-lo dele. Esses são os métodos focus e blur.

Vamos ver seu funcionamento com um exemplo. Suponha que temos um input e um botão:

<input id="elem" value="text">
<input type="submit" id="button">

Vamos definir que, ao clicar no botão, o foco de entrada seja definido no nosso input:

let elem   = document.querySelector('#elem');
let button = document.querySelector('#button');

button.addEventListener('click', function() {
	elem.focus();
});

Existem dois inputs. Faça com que, após a digitação de dois caracteres, o foco de entrada passe para o segundo input, e após a digitação de dois caracteres neste input - o foco seja removido dele.