阻止事件e.stopPropagation()和e.preventDefault的区别

e.stopPropagation() 和 e.preventDefault() 是两个在事件处理中常用的方法，它们有不同的作用：

e.stopPropagation():
- 作用：阻止事件在DOM中的进一步传播，即停止事件冒泡。
- 使用场景：当你希望阻止一个事件从目标元素向上传播到父元素或祖先元素时，可以调用 e.stopPropagation()。
- 示例：
```
document.getElementById('myButton').addEventListener('click', function(e) {e.stopPropagation(); // 阻止点击事件继续向上传播console.log('Button clicked');
});
```
e.preventDefault():
- 作用：阻止事件的默认行为。
- 使用场景：有些元素上的事件有默认的行为，比如点击链接会跳转到新页面，提交表单会刷新页面等。通过调用 e.preventDefault()，你可以阻止这些默认行为的发生。
- 示例：
```
document.getElementById('myForm').addEventListener('submit', function(e) {e.preventDefault(); // 阻止表单的默认提交行为console.log('Form submitted');
});
```

这两个方法可以单独使用，也可以组合使用，具体取决于你的需求。如果你想阻止事件传播并阻止默认行为，可以同时调用这两个方法：

document.getElementById('myLink').addEventListener('click', function(e) {e.stopPropagation(); // 阻止点击事件继续向上传播e.preventDefault(); // 阻止链接的默认跳转行为console.log('Link clicked');
});