diadia

興味があることをやってみる。自分のメモを残しておきます。

addEventListenerの使い方

Javascript

関連記事

イベントとイベントハンドラの設定

addEventListenerの使い方

意義としてはonclick等は一つのイベントに一つのイベントハンドラしか設置できない。一つのイベントに複数のイベントハンドラを設置するときにに役に立つ。

サンプル使用例

<!DOCTYPE html>
<html lang="utf-8">
	<head>
		<meta charset="utf-8">
		<title>ボタンクリックでコンソールログ表示とアラートの表示</title>

	</head>
	<body>
		<button id="btn" type="submit">表示する</button>

		<script>
			var btn = document.getElementById("btn");
            window.onload = function(){
            	btn.addEventListener("click", function(){
                    console.log("load成功");
            	});
                 
                btn.addEventListener("click", function(){
                    alert("load成功");
            	});

                   			}
		</script>
	</body>