Obtenez l'élément par ID par une chaîne partiellement correspondante à l'aide de JavaScript

Obtenez l'élément par ID par une chaîne partiellement correspondante à l'aide de JavaScript
Les pages Web ayant plusieurs fonctionnalités nécessitent généralement des codes longs. Dans un tel cas, l'allocation d'une identité commune ou d'une partie de celle-ci à plusieurs éléments aide le développeur. Par exemple, allouant une partie de l'ID, qui est la même dans tous les éléments, pour y accéder en même temps. Dans de tels cas, obtenir un élément par ID en correspondant partiellement à la chaîne en javascript est d'une grande aide pour simplifier la complexité du code.

Ce blog discutera de l'approche pour obtenir l'élément par ID en correspondant partiellement à la chaîne en javascript.

Comment obtenir / récupérer un élément par identifiant par une chaîne partiellement correspondante en javascript?

L'élément peut être récupéré par ID en correspondant partiellement à la chaîne en javascript en utilisant le «document.queySelectorall ()" méthode. Cette méthode récupère tous les éléments correspondant à un (s) sélecteur (s) CSS et renvoie une liste de nœuds.

Syntaxe

document.QuerySelectorall (sélecteurs)

Dans la syntaxe ci-dessus:

"sélecteurs»Reportez-vous à un ou plusieurs sélecteurs CSS.

Exemple 1: Obtenez un élément en correspondant partiellement à l'ID depuis le début

Dans cet exemple, le «document.queySelectorall ()«La méthode peut être utilisée pour récupérer l'élément en spécifiant son ID de chaîne depuis le début et non l'ID complet:


Effectuez les étapes suivantes dans l'extrait de code ci-dessus:

  • Premièrement, spécifiez le «”Element en spécifiant sa source via le«SRC"Attribut et le déclaré"identifiant".
  • Après cela, dans le code JavaScript, accédez à l'élément spécifié par son «identifiant"Dès le début en utilisant le"queySelectorall ()" méthode.
  • Noter que "^»Correspond au début.
  • Enfin, affichez l'élément récupéré par son ID de chaîne partiel à partir du début de la console.

Sortir

Dans la sortie ci-dessus, on peut observer que l'élément correspondant et son ID sont affichés sur la console.

Exemple 2: Obtenez un élément en correspondant partiellement à l'ID depuis la fin

Dans cet exemple, le «document.queySelectorall ()«La méthode peut également être appliquée pour obtenir l'élément en correspondant partiellement à l'ID de chaîne à partir de la fin:


Implémentez les étapes suivantes dans les lignes de code ci-dessus:

  • Rappelez-vous l'approche discutée pour inclure l'image ayant l'indice «identifiant".
  • Dans le code JS, accédez à l'inclusion "”Element en spécifiant son ID à partir de la fin en utilisant le"queySelectorall ()" méthode.
  • Notez que le «$"Dans le code correspond à l'ID depuis la fin.
  • Enfin, affichez l'élément correspondant sur la console.

Sortir

La sortie ci-dessus indique que l'exigence souhaitée est obtenue.

Exemple 3: Obtenez un élément en correspondant partiellement à l'ID contenu

Dans cette démonstration, l'élément correspondant sera récupéré en correspondant partiellement à l'ID de chaîne à partir de l'une des positions:


Dans le code ci-dessus:

  • De même, incluez l'image indiquée ayant l'attribution «identifiant".
  • Dans le code JavaScript, accédez à l'élément en correspondant partiellement au «identifiant”Avoir la valeur de chaîne indiquée.
  • Noter que "*”Correspond à l'ID de n'importe quelle position.
  • Enfin, affichez l'élément récupéré.

Sortir

L'élément récupéré dans la sortie ci-dessus vérifie que le «spécifié«identifiant"Est apparié avec l'ID de l'élément de l'une des positions.

Conclusion

Le "document.queySelectorall ()«La méthode peut être utilisée pour récupérer un élément par son ID en correspondant à la chaîne en partie à l'aide de JavaScript. Cette méthode peut être implémentée pour correspondre partiellement à la chaîne contenue dans un ID à partir de début, de fin ou de n'importe quelle position pour récupérer un élément. Ce tutoriel a expliqué comment récupérer un élément par ID en faisant correspondre une chaîne partiellement en javascript.