<button id="btn">click</button>

<script>
document.getElementById("#btn").addEventListener("click",function(){
alert("hello");
})
</script>

第一種方式 type後緊跟function；

<button id="btn">click</button>
<script>
document.getElementById('#btn').addEventListener('click',myFunction)
function myFunction(){
alert("hello")
}
</script>
 

第二種方式 type後跟要執行的函式 切記沒有（）

也可以新增多種同類型事件 不會覆蓋已存在的事件 也可以給同一元素新增多種不同型別的事件

使用removeEventListener()移除新增的事件控制代碼

若瀏覽器不支援addEventListener()可以使用attachEvent()替代

var x = document.getElementById("myBtn");
if (x.addEventListener) {                    //所有主流瀏覽器，除了 IE 8 及更早 IE版本
    x.addEventListener("click", myFunction);
} else if (x.attachEvent) {                  // IE 8 及更早 IE 版本
    x.attachEvent("onclick", myFunction);
}