Comment puis-je déterminer l'élément DOM actuellement ciblé en JavaScript ?

Détermination de l'élément avec le focus en JavaScript

Trouver l'élément DOM possédant actuellement le focus peut être une tâche utile pour diverses interactions de l'interface utilisateur.

document.activeElement

La solution à ce problème réside dans la propriété document.activeElement. Il fournit la référence à l'élément DOM qui détient le focus. Cette propriété est prise en charge par les navigateurs modernes, ce qui en fait une solution fiable pour les projets JavaScript.

Implémentation

Pour utiliser document.activeElement en pratique, vous pouvez récupérer l'élément ciblé comme ceci :

const focusedElement = document.activeElement;

Cela vous donnera une référence à l'élément actuellement ciblé, vous permettant de le manipuler ou d'effectuer toute opération nécessaire opérations.

Considérations supplémentaires

Dans les anciens navigateurs, détecter quel champ de formulaire avait le focus n'était pas simple. Pour contourner ce problème, vous pouvez attribuer des gestionnaires d'événements « focus » et « flou » à tous les champs, en suivant le dernier élément ciblé dans une variable. Le gestionnaire de "flou" effacerait cette variable en cas de perte du focus.

Flou de l'élément actif

Une fois que vous avez la référence à l'élément actif, vous pouvez utiliser le flou méthode pour en supprimer le focus. Cela peut être utile lorsque vous devez déplacer le focus par programmation sur un élément différent :

document.activeElement.blur();

Cela transférera le focus sur l'élément body.

Ressources associées

• [Navigateur activeElement Compatibilité](https://developer.mozilla.org/en-US/docs/Web/API/document.activeElement#Browser_compatibility)
• [alternative jQuery pour document.activeElement](https://stackoverflow. com/questions/9508980/jquery-alternative-for-document-activeelement)

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!