Pegar o id do botão ao clicar nele em JavaScript

Neste artigo você vai aprender a como pegar o id do botão ao clicar nele, utilizando o evento de click de DOM

Fala programador(a), beleza? Bora aprender mais sobre DOM e JavaScript!

Primeiramente será necessário mapear o evento de click no nosso botão

Após o evento está acessível, temos acesso a um objeto especial chamado event

Este evento tem algumas informações do elemento que disparou o evento

Vamos acessar então a propriedade srcElement e lá acessamos a propriedade id, simples não é?

Veja um exemplo na prática:

const button = document.querySelector("#my-btn");

button.addEventListener("click", (e) => {

	console.log(e.srcElement.id); // my-btn

})

Veja que selecionamos o elemento com querySelector, aqui o seu seletor pode ser alterado, não há problema

Você deve selecionar o seu ou os seus elementos que recebem o evento

Depois ativamos o evento de click e também realizamos a impressão do id do elemento, que é o que buscamos

Agora conseguimos obter o id de um elemento que foi clicado

Conclusão

Neste artigo você aprendeu a como pegar o id do botão ao clicar nele

Primeiramente selecionamos o elemento, depois ativamos o evento de click, ou o observamos, como você preferir 🙂

E por fim é acessada a propriedade id, que está dentro de srcElement, que fica no objeto event

Confira nossos cursos gratuitos no Youtube, com vídeos todos os dias! Se inscreva e ative o sininho para receber as notificações e aprender mais ainda sobre desenvolvimento web!

Veja também nosso catálogo de cursos na Udemy, todos com exercícios e projetos práticos, nas mais diversas tecnologias. O link acima contém um cupom de desconto para os curso