Méthodes focus et blur en JavaScript

Vous savez déjà ce qu'est le focus de saisie. Vous savez également comment définir ou perdre le focus : pour le définir, vous devez cliquer dans le champ de saisie, et pour le perdre - cliquer ailleurs.

En JavaScript, cependant, il existe des méthodes spéciales qui permettent de définir forcément le focus sur une entrée ou de l'en retirer. Ce sont les méthodes focus et blur.

Regardons leur fonctionnement sur un exemple. Supposons que nous ayons une entrée et un bouton :

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

Faisons en sorte qu'en cliquant sur le bouton, le focus de saisie soit placé sur notre entrée :

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

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

Deux entrées sont données. Faites en sorte qu'après la saisie de deux caractères, le focus de saisie passe à la deuxième entrée, et qu'après la saisie de deux caractères dans cette entrée - le focus en soit retiré.