Obtenir l'ID du bouton cliqué en utilisant ONCLICK - JavaScript

Obtenir l'ID du bouton cliqué en utilisant ONCLICK - JavaScript

Parfois, les programmeurs doivent déterminer l'ID assigné des éléments HTML, comme un bouton. Supposons que le développeur souhaite obtenir l'ID sur l'événement de clic du bouton, ce qui signifie que lorsque le bouton spécifique est cliqué, son ID attribué s'affiche sur la console ou dans un message d'alerte.

Ce message définira la procédure pour obtenir l'ID du bouton cliqué à l'aide de l'événement OnClick.

Comment obtenir / accéder à l'ID du bouton cliqué en utilisant onclick en javascript?

Pour obtenir / accéder à l'ID du bouton cliqué, utilisez les approches suivantes:

  • "événement.cible.Attribut id ”
  • "ce.Attribut id ”

Méthode 1: Obtenez l'ID du bouton cliqué en utilisant "Event.cible.Attribut id ”

Utilisez le "événement.cible.identifiant"Attribut pour obtenir l'ID du bouton cliqué sur le associé"sur clic" événement. Il se réfère au «identifiant”Propriété de l'élément qui a déclenché l'événement dans l'arbre Dom.

Exemple

Dans un fichier HTML, créez cinq boutons en attribuant différents ID, "BTN1 ”,« BTN2 »,« BTN3 »,« BTN4 »et« BTN5", respectivement. Attacher un «sur clic»Événement qui appellera le«getID ()”Fonction sur le bouton CLIC:





Créer une zone en utilisant le

Tag pour afficher l'ID respectif du bouton sur le bouton CLIC:

Maintenant, définissez une fonction nommée «getID ()"Cela se déclenchera sur l'événement de clic du bouton pour obtenir et afficher l'ID respectivement attribué à l'aide de"événement.cible.identifiant»:

fonction getID ()
var btnid = événement.cible.identifiant;
document.getElementByid ("résultat").innerhtml = "L'ID du bouton cliqué est:" + btnid;

La sortie indique que les ID respectifs des boutons ont été affichés avec succès:

Méthode 2: Obtenez l'ID du bouton cliqué en utilisant «ceci.Attribut id ”

Vous pouvez également utiliser le «ce.identifiant”Attribut pour accéder à l'ID du bouton cliqué. Le "ce.identifiant" se réfère à la "identifiant”Attribut de l'objet actuel. Dans un auditeur d'événements DOM, il fait référence au «identifiant”De l'instance de l'élément à l'endroit où l'auditeur était attaché.

Exemple

Ici, dans l'exemple donné, nous appellerons le «getID ()"Fonction sur l'événement OnClick du bouton en passant le"ce.identifiant”Attribut en tant que paramètre qui renverra l'ID de l'élément spécifié:






Maintenant, dans le fichier javascript, définissez une fonction "getID ()«En passant l'ID du bouton comme un argument qui se déclenchera sur le bouton Cliquez:

fonction getID (btnid)
document.getElementByid ("résultat").innerhtml = "L'ID du bouton cliqué est:" + btnid;

Sortir

Il s'agit d'obtenir l'ID du bouton cliqué en utilisant le onclick en javascript.

Conclusion

Pour obtenir l'ID du bouton cliqué sur le "sur clic»Événement, utilisez le«événement.cible.identifiant«Attribut ou«ce.identifiant" attribut. "ce.identifiant«Se référerait au«identifiant«De l'instance de l'élément auquel l'auditeur était attaché, tandis que«événement.cible.identifiant«Se référerait au«identifiant«De l'élément qui a réellement déclenché l'événement, qui peut être un élément enfant de l'élément auquel l'auditeur était attaché. Dans cet article, nous avons défini la procédure pour obtenir l'ID du bouton cliqué à l'aide de l'événement OnClick.