クリックした要素を取得

イベント ＞ クリック

概要

　閲覧数:654 　投稿日:2017-06-04 　更新日:2017-06-04 　

イベントターゲットを使用して、クリックした要素を取得

第1引数は任意の名前
・event、e など

コード

//JavaScript
document.body.addEventListener( 'click', function(event) {
  console.log(event.target);
});

//jQuery
$(document).click(function(event){
  const target = $(event.target);
  console.log(target);
});


タグ


event　


クリックした要素のid名を取得 ／ クリックした要素のクラス名を取得



類似度ページランキング
順位 ページタイトル抜粋 ％
1 クリックした要素を取得 91
2 クリックした要素のid名を取得 ／ クリックした要素のクラス名を取得 44
3 右クリック禁止 33
4 オブジェクトの要素数を数える 32
5 現在日時を、dateオブジェクトとして取得 31
6 _以降の文字列を取得 29
7 オブジェクト内配列より、重複しない値を取得して、新たな配列を生成 28
8 HTMLからタイトルを取得 25
9 配列からランダムに値を取得 25
10 現在日時を取得後、整形表示 25
11 オブジェクトのキーとして、配列からランダムな値を取得して使用 24
12 配列をネストしたオブジェクトを生成し、アクセス 24
13 オブジェクトを生成し、アクセス 23
14 配列の要素を「数値の降順」にソート 21
15 配列内の要素を、長さの少ない順に並べ替え 19
16 オブジェクトのキーとして、変数の値を使用 19
17 現在日時を、「1970年1月1日0時0分0秒（UTC）からの経過秒数」として、ミリ秒単位で取得 17
18 文字列を、指定した区切り文字で分割し、配列へ格納 17
19 指定要素の全ての子要素除去後、子要素リスト末尾へ指定要素追加 15
20 文字列を正規表現で置換。「最初にマッチした内容のみ置換」する場合と、「マッチした内容全てを置換」する場合 13
2025/4/30 15:18 更新
週間人気ページランキング ／ 4-23 → 4-29
順位 ページタイトル抜粋 アクセス数
1 クリックした要素のid名を取得 ／ クリックした要素のクラス名を取得 | クリック(イベント) 10
2 JavaScriptコード 3
2 クリックした要素を取得 | クリック(イベント) 3
3 spilitで、指定した内容で分割できないときの戻り値は、["対象文字列"] | 文字列(テキスト処理) 2
3 json 文字列を eval 関数(セキュリティリスクあり)を使ってオブジェクトへ変換 | JSON 2
3 json 文字列を JSON.parse() メソッド(推奨)を使ってオブジェクトへ変換 | JSON 2
3 配列からランダムに値を取得 | 配列 2
3 正規表現(テキスト処理) カテゴリー 2
3 数値のゼロ埋め（桁を揃える） | テキスト処理 2
3 三項演算子の入れ子 | 三項演算子(演算子) 2
3 eval | タグ毎エントリー一覧 2
3 「二つ置き」毎に結果が7増加するよう数字を表示 | 算術演算子(演算子) 2
3 firstChild | タグ毎エントリー一覧 2
3 replace | タグ毎エントリー一覧 2
3 現在日時を取得後、整形表示 | 日付および時刻関連 2
3 t | タグ毎エントリー一覧 2
3 n | タグ毎エントリー一覧 2
3 location | タグ毎エントリー一覧 2
3 p | タグ毎エントリー一覧 2
3 oncontextmenu | タグ毎エントリー一覧 2
2025/4/30 1:02 更新