Nom d'élément générique correspondant à "querySelector()" et "querySelectorAll()" en JavaScript

Problème :

Interroger un document XML avec des éléments ayant des chaînes spécifiques intégrées dans leurs noms peut s'avérer difficile. Bien que CSS prenne en charge les caractères génériques pour les requêtes d'attributs, la même fonctionnalité semble manquer pour les noms d'éléments.

Solution :

Malheureusement, il n'existe aucun moyen simple de faire correspondre un élément générique. noms utilisant "querySelector()" ou "querySelectorAll()". Cependant, il existe des approches alternatives :

• Correspondance d'attributs : CSS fournit des caractères génériques pour les valeurs d'attribut. Pour faire correspondre des éléments avec une chaîne particulière dans leur nom, recherchez la présence de cette chaîne dans l'un de leurs attributs en utilisant la syntaxe suivante :

  • [attribute^='value'] correspond aux éléments dont l'attribut commence par avec 'value'.
  • [attribute$='value'] correspond aux éléments dont l'attribut se termine par 'value'.
  • [attribute*='value'] correspond aux éléments dont l'attribut contient 'value'.
• Attribut de nom : Si vous souhaitez faire correspondre l'attribut 'name', remplacez simplement 'id' par 'name' dans ce qui précède. expressions.

Exemple :

Pour rechercher tous les éléments avec la chaîne "name" dans leur attribut 'name', vous pouvez utiliser :

const elementsWithName = document.querySelectorAll('[name*="name"]');

Remarque :

Si vous recherchez une correspondance générique pour le nom de la balise d'élément lui-même, il n'existe actuellement aucune solution directe utilisant "querySelector()" ou "querySelectorAll()".