Obtendo o ID do botão clicado usando OnClick - JavaScript
Às vezes, os programadores precisam determinar o ID atribuído dos elementos HTML, como um botão. Suponha que o desenvolvedor deseja obter o ID no evento de clique do botão, ou seja, quando o botão específico é clicado, o ID atribuído será exibido no console ou em uma mensagem de alerta.
Esta posta.
Como obter/acessar o ID do botão clicado usando OnClick em JavaScript?
Para obter/acessar o ID do botão clicado, use as seguintes abordagens:
- "evento.alvo.ID ”atributo
- "esse.ID ”atributo
Método 1: Obtenha o ID do botão clicado usando “Evento.alvo.ID ”atributo
Use o "evento.alvo.eu ia”Atributo para obter o ID do botão clicado no associado“ONCLICKEvento. Refere -se ao “eu iaPropriedade do elemento que desencadeou o evento na árvore Dom.
Exemplo
Em um arquivo HTML, crie cinco botões atribuindo IDs diferentes, “BTN1 "," BTN2 "," BTN3 "," BTN4 "e" BTN5”, Respectivamente. Anexe um “ONCLICK”Evento que chamará o“getid ()”Função no botão Clique:
Criar uma área usando o
Tag para exibir o respectivo ID do botão no botão Clique:
Agora, defina uma função chamada “getid ()”Isso acionará o evento de clique do botão para obter e exibir o ID atribuído, respectivamente, usando o“evento.alvo.eu ia”:
function getId ()var btnid = evento.alvo.eu ia;
documento.getElementById ("resultado").INNERHTML = "O ID do botão clicado é:" + btnid;
A saída indica que os respectivos IDs dos botões foram exibidos com sucesso:
Método 2: Obtenha o ID do botão clicado usando “this.ID ”atributo
Você também pode utilizar o “esse.eu ia”Atributo para acessar o ID do botão clicado. O "esse.eu ia" refere-se a "eu ia”Atributo do objeto atual. Em um ouvinte de evento DOM, refere -se ao “eu ia”Da instância do elemento para onde o ouvinte estava anexado.
Exemplo
Aqui, no exemplo dado, chamaremos o “getid ()”Função no evento OnClick do botão, passando o“esse.eu ia”Atributo como um parâmetro que retornará o ID do elemento especificado:
Agora, no arquivo javascript, defina uma função “getid ()”Ao passar o ID do botão como um argumento que acionará o clique do botão:
função getId (btnid)documento.getElementById ("resultado").INNERHTML = "O ID do botão clicado é:" + btnid;
Saída
Isso se trata de obter o ID do botão clicado usando o OnClick em JavaScript.
Conclusão
Para obter o ID do botão clicado no “ONCLICKEvento, use o “evento.alvo.eu iaAtributo ou o “esse.eu ia”Atributo. ““esse.eu ia”Referiria -se ao“eu ia”Da instância do elemento ao qual o ouvinte foi anexado, enquanto“evento.alvo.eu ia”Referiria -se ao“eu ia”Do elemento que realmente desencadeou o evento, que pode ser um elemento infantil do elemento que o ouvinte foi anexado. Nesta postagem, definimos o procedimento para obter o ID do botão clicado usando o evento OnClick.