事件綁定/監聽的方法

1.直接綁定

顧名思義，直接在DOM元素上綁定onclick、onmouseover、onmouseout、onmousedown、onmouseup、ondblclick、onkeydown、onkeypress、onkeyup等事件

var ul = document.getElementById(‘ul‘)
console.log(ul)
ul.onclick = function() {
    console.log(‘click 事件綁定成功‘)
}

這種方法最簡單，也是DOM level0最早支持的一種方法。但是這個方法存在一個很大的問題。那就是如果一個元素綁定事件時，有可能覆蓋掉前面已經綁定好的事件！尤其是存在多個js文件時。為了解決這個問題，level2新增了事件監聽

2.事件監聽

事件監聽實現的功能和直接綁定差不多，但是新增了一個特點。那就是無論監聽次，都不會覆蓋掉前面的監聽事件。本質原因是監聽事件每次都會生產一個全新的匿名函數，和前面的函數完全不同，自然不會覆蓋。

var ul = document.getElementById(‘ul‘)
        ul.addEventListener(‘click‘, function() {
            console.log(‘事件綁定成功1‘)
        })
        ul.addEventListener(‘click‘, function() {
            console.log(
 
‘事件綁定成功2‘)
        })

js事件綁定/監聽