日期：2020-08-30
冒泡（默认）
点击son盒子，先打印son标签，再打印father标签
<body>
<div class="father">
<div class="son"></div>
</div>
<script>
var son = document.querySelector('.son');
var father = document.querySelector('.father');
son.addEventListener('click', function(e) {
// e.stopPropagation();
console.log(son);
});
father.addEventListener('click', function(e) {
// e.stopPropagation();
console.log(father);
});
</script>
</body>
捕获
点击son盒子，先打印father标签，再打印son标签
<body>
<div class="father">
<div class="son"></div>
</div>
<script>
var son = document.querySelector('.son');
var father = document.querySelector('.father');
son.addEventListener('click', function(e) {
// e.stopPropagation();
console.log(son);
}，true);
father.addEventListener('click', function(e) {
// e.stopPropagation();
console.log(father);
}，true);
</script>
</body>
我理解的误区纠正（不考虑阻止传播）：
捕获跟冒泡的区别在于，先后执行点击到的区域的意思。点击father并不会触发son的触发事件。我原来理解的捕获以为是，点击father盒子，会触发点击son盒子事件。纠正的最简单的理解：你都没有点击son盒子区域，怎么会触发son盒子事件，捕获没有那么高级，不能想当然！
51
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
