事件监听，三要素：
事件源、事件类型、事件处理函数。
js事件监听版本：
1.早期：
事件源.on事件 = function(){}
eg:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<button>点击</button>
<script>
let btn = document.querySelector('button')
btn.onclick = function(){
alert('好的')
}
</script>
</body>
</html>
2.现在
事件源.addEventListener(事件，事件处理函数)
eg:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<button>点击</button>
<script>
let btn = document.querySelector('button')
btn.addEventListener('click',function(){
alert('OK')
})
</script>
</body>
</html>
区别：on方式会被覆盖，addEventListener方式可绑定多次，拥有事件更多特性，推荐使用。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<button>点击</button>
<script>
let btn = document.querySelector('button')
// btn.onclick = function(){
// alert('好的')
// }
// btn.onclick = function(){
// alert('B')
// }
// //结果是弹出B。（A被覆盖）
btn.addEventListener('click',function(){
alert('C')
})
btn.addEventListener('click',function(){
alert('D')
})
//结果是先弹出C、再弹出D
</script>
</body>
</html>
1991
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
