<!DOCTYPE html>
<html>
<body>
<h2>JavaScript addEventListener()</h2>
<p>この例では、addEventListener() メソッドを使用して、同じボタンに多数のイベントを追加します。</p>
<button id="myBtn">それを試してみてください</button>
<p id="demo"></p>
<script>
var x = document.getElementById("myBtn");
x.addEventListener("mouseover", myFunction);
x.addEventListener("click", mySecondFunction);
x.addEventListener("mouseout", myThirdFunction);
function myFunction() {
document.getElementById("demo").innerHTML += "Moused over!<br>";
}
function mySecondFunction() {
document.getElementById("demo").innerHTML += "Clicked!<br>";
}