【JavaScript】クリックした要素のidを取得する

クリックしたidの要素を取得してゴニョゴニョしたいケースってよくありますよね。

target

hoge.addEventListner('click', (e) => {
  console.log(e.target.id);
})

↑はコンソールにクリックした要素（hoge）のidが出力されます。

targetプロパティはElementではなくEventが持っているもので、上記の例だとイベントが発生した要素『hoge』が該当し、イベントの呼び出し元（hogeオブジェクト）のプロパティ（今回はid）を取得することができます。

今回はid取得ですが、クラスを取得したい場合は『target.className』になります。

それと、似たプロパティの『currentTarget』は『イベントハンドラを登録した要素』です。

Event.target ＝イベントが発生した要素

Event.currentTarget ＝イベントハンドラを登録した要素