1.什么是事件冒泡？
事件冒泡就是从具体到不具体，
例如：当你给了一个button按钮一个点击事件，再给他的父级相同的事件，就会按照，button，body，document，window，继续向上冒泡。
2。什么是事件捕获？
从不具体到具体，跟事件冒泡刚好相反。window document body button 。
例如：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<style>
* {
margin: 0;
padding: 0;
list-style: none;
}
#box {
width: 100px;
height: 100px;
background: red;
position: absolute;
left: 0;
top: 0;
}
</style>
<script>
window.onload = function () {
var oBtn = document.getElementById(‘btn‘);
oBtn.setCapture();
oBtn.onclick = function(){
alert(‘1‘);
}
}
</script>
</head>
<body>
<input type="button" value="按钮" id="btn">
</body>
</html>
3.Dom事件流包括三个阶段。
1.>事件捕获阶段
2.>处于目标阶段
3.>事件冒泡阶段
4.事件捕获阶段
window.addEventListener(‘click‘,function(){
},true)
为true代表事件使用事件捕获模式，false则代表使用事件冒泡
5.阻止事件冒泡 stopPropagation()
时间： 2024-10-13 11:20:56