stopPropagation()用于阻止事件冒泡但不影响当前元素其他监听器执行，需在事件处理函数中显式调用；它只中断冒泡阶段，不阻止默认行为，与return false在原生事件中行为不同。
在 JavaScript 中，stopPropagation() 方法用于阻止事件继续向上级元素（父元素）冒泡，但它不会影响当前元素上其他同类型事件监听器的执行。
stopPropagation 的基本用法
调用 event.stopPropagation() 即可中断当前事件的冒泡路径。它通常写在事件处理函数内部，且只对当前触发的事件实例生效。
- 只阻止冒泡，不阻止默认行为（如点击链接跳转、表单提交），需额外调用
event.preventDefault() - 对捕获阶段和冒泡阶段都有效，但不影响同一阶段其他监听器运行
- 不能跨事件调用，每次事件触发时需在对应回调中显式调用
实际例子：点击子元素时不触发父元素的 click
假设有一个嵌套结构：
<div id="parent"> 父容器 <button id="child">点我</button> </div>
绑定两个事件：
立即学习“Java免费学习笔记（深入）”；
document.getElementById('child').addEventListener('click', function(e) {
console.log('按钮被点击');
e.stopPropagation(); // 阻止冒泡到 parent
});
document.getElementById('parent').addEventListener('click', function() {
console.log('父容器被点击'); // 这行不会执行
});
此时点击按钮，只会输出“按钮被点击”，父容器的监听器不会触发。
注意 stopPropagation 和 return false 的区别
在原生 JavaScript 中，return false 并不会自动调用 stopPropagation()，它的行为取决于事件绑定方式：
- 在
onclick="..."内联处理中，return false相当于同时调用preventDefault()和stopPropagation() - 在
addEventListener中，return false没有效果，必须显式调用e.stopPropagation()和/或e.preventDefault()
什么时候不该用 stopPropagation
滥用 stopPropagation() 可能破坏组件间通信或全局事件管理逻辑，例如：
- 弹窗、下拉菜单等依赖外层点击关闭的场景，过早阻止冒泡会导致关闭失效
- 第三方库（如 React、Vue 的事件系统）可能依赖事件冒泡做委托处理
- 全局监听的分析埋点（如统计所有按钮点击）可能因此漏掉数据
更安全的做法是：优先使用事件委托 + 条件判断，而非无差别阻止冒泡。
