版本：
<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>事件监听方法</title>
</head><body><button>点击</button><script>// 第一版事件监听const btn = document.querySelector('button')// btn.onclick = function () {// alert('111')// }// btn.onclick = function () {// alert('222')// }//后面的会覆盖前面的// 第二版事件监听btn.addEventListener('click', function () {alert('111')})btn.addEventListener('click', function () {alert('222')})//不会覆盖，可以绑定多次</script>
</body></html>
事件类型
<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>事件类型</title>
</head>
<style>div {width: 200px;height: 200px;background-color: pink;}
</style><body><div></div><script>const div = document.querySelector('div')//鼠标经过div.addEventListener('mouseenter', function () {console.log('我来了')})// 鼠标离开div.addEventListener('mouseenter', function () {console.log('我走了')})</script>
</body></html>