Ottenere l'ID del pulsante Clicked Using OnClick - JavaScript

Ottenere l'ID del pulsante Clicked Using OnClick - JavaScript

A volte, i programmatori devono determinare l'ID assegnato degli elementi HTML, come un pulsante. Supponiamo che lo sviluppatore desidera ottenere l'ID sull'evento click del pulsante, il che significa che quando si fa clic sul pulsante specifico, l'ID assegnato verrà visualizzato sulla console o in un messaggio di avviso.

Questo post definirà la procedura per ottenere l'ID del pulsante cliccato utilizzando l'evento OnClick.

Come ottenere/accedere all'ID del pulsante Fare clic su OnClick in JavaScript?

Per ottenere/accedere all'ID del pulsante cliccato, utilizzare i seguenti approcci:

  • "evento.bersaglio.attributo id ”
  • "Questo.attributo id ”

Metodo 1: ottieni l'ID del pulsante Fare clic su "Evento.bersaglio.attributo id ”

Usa il "evento.bersaglio.id"Attributo per ottenere l'ID del pulsante Clicked su Associated"al clic"Evento. Si riferisce al "id"Proprietà dell'elemento che ha innescato l'evento nell'albero DOM.

Esempio

In un file HTML, crea cinque pulsanti assegnando ID diversi, "btn1 "," btn2 "," btn3 "," btn4 "e" btn5"Rispettivamente. Attacca un "al clic"Evento che chiamerà il"getID ()"Funzione sul pulsante Clicca:





Creare un'area usando il file

Tag per visualizzare i rispettivi ID del pulsante sul pulsante Clicca:

Ora, definisci una funzione chiamata "getID ()"Ciò attiverà l'evento click del pulsante per ottenere e visualizzare l'ID rispettivamente assegnato utilizzando"evento.bersaglio.id":

funzione getid ()
var btnid = evento.bersaglio.id;
documento.getElementById ("risultato").InnerHtml = "L'ID del pulsante cliccato è:" + btnid;

L'output indica che i rispettivi ID dei pulsanti sono stati visualizzati correttamente:

Metodo 2: ottieni l'ID del pulsante Clicked Using “questo.attributo id ”

Puoi anche utilizzare il "Questo.id"Attributo per accedere all'ID del pulsante cliccato. IL "Questo.id" si riferisce a "id"Attributo dell'oggetto corrente. In un ascoltatore di eventi DOM, si riferisce al "id"Delle istanza dell'elemento verso dove era attaccato l'ascoltatore.

Esempio

Qui, nell'esempio dato, chiameremo "getID ()"Funzione sull'evento OnClick del pulsante passando il"Questo.id"Attributo come parametro che restituirà l'ID dell'elemento specificato:






Ora, nel file JavaScript, definisce una funzione "getID ()"Passando l'ID del pulsante come argomento che attiverà il clic del pulsante:

funzione getid (btnid)
documento.getElementById ("risultato").InnerHtml = "L'ID del pulsante cliccato è:" + btnid;

Produzione

Si tratta di ottenere l'ID del pulsante Clicked Using the OnClick in JavaScript.

Conclusione

Per ottenere l'ID del pulsante Clicked su "al clicEvento ", usa il"evento.bersaglio.id"Attributo o"Questo.id"Attributo. "Questo.id"Si riferirebbe a"id"Dell'istanza dell'elemento a cui era attaccato l'ascoltatore, mentre"evento.bersaglio.id"Si riferirebbe a"id"Dell'elemento che ha effettivamente innescato l'evento, che potrebbe essere un elemento figlio dell'elemento a cui l'ascoltatore era attaccato. In questo post, abbiamo definito la procedura per ottenere l'ID del pulsante Clicked utilizzando l'evento OnClick.