preventDefault()用于取消浏览器默认行为，如阻止表单提交刷新或超链接跳转；须在事件处理函数中同步调用，仅对含默认行为的事件有效，且不能异步执行。
preventDefault() 是事件对象上的一个方法，用来取消浏览器对某些事件的默认行为。在表单提交和超链接跳转这类场景中，它能有效阻止页面刷新或跳转，让开发者接管后续逻辑。
阻止表单默认提交
表单的 submit 事件触发时，浏览器默认会收集数据、发送请求并刷新页面。调用 event.preventDefault() 可中断这个流程，便于用 AJAX 提交或做前端校验。
- 必须绑定在
form元素的submit事件上（不是按钮的 click） - 推荐使用事件委托或直接监听，确保事件对象可用
- 示例：
document.querySelector('form').addEventListener('submit', function(e) {<br> e.preventDefault();<br> // 自定义提交逻辑，如 fetch() 或表单验证<br>});
阻止超链接默认跳转
点击 <a href="..."> 时，浏览器默认跳转到目标 URL。在事件处理函数中调用 preventDefault() 即可拦截该行为。
- 适用于任何有
href属性的链接，包括空链接（href="#"） - 注意：仅阻止跳转，不阻止事件冒泡；如需同时阻止冒泡，另加
e.stopPropagation() - 示例：
document.querySelector('a').addEventListener('click', function(e) {<br> e.preventDefault();<br> // 比如弹出模态框、加载内容、执行 JS 逻辑<br>});
常见误区与注意事项
preventDefault 不是万能开关，它的效果取决于事件类型和触发时机。
立即学习“Java免费学习笔记（深入）”；
- 只能在事件处理函数中调用，且必须在事件未结束前执行（不能异步调用）
- 对已发生的默认行为无效（比如用户已按下回车触发了提交，再补调 preventDefault 就晚了）
- 部分事件（如
load、error）没有默认行为，调用 preventDefault 无意义 - 若同时使用
return false，它会同时阻止默认行为和事件冒泡，但语义不如显式调用preventDefault()清晰
替代方案与补充技巧
除了 preventDefault，还有更轻量或更语义化的做法：
- 超链接临时禁用跳转：把
href改为javascript:void(0)或#，但需配合 preventDefault 才可靠 - 表单提交前校验失败时才阻止：在验证通过后不调用 preventDefault，让浏览器自然提交
- 现代写法推荐使用箭头函数 + 解构获取 event：
form.addEventListener('submit', (e) => { e.preventDefault(); /* ... */ });
