focus和blur事件用于处理HTML表单中的焦点控制，通过JavaScript可实现样式变化、实时验证与提示。1. 可使用addEventListener绑定focus和blur事件，实现输入框获得焦点时边框变蓝，失去焦点时恢复原色；2. 也可在HTML中直接使用onfocus和onblur内联属性操作样式，但不推荐；3. 实际应用中常在blur事件中校验邮箱格式，并显示对应提示信息，focus时清除提示；4. 普通div等元素需添加tabindex才能触发焦点事件。合理运用可提升表单交互体验。
在HTML表单中，处理焦点事件主要通过focus和blur事件来实现。当用户将输入焦点放在表单元素上时触发focus事件，当焦点离开该元素时触发blur事件。这两个事件非常适合用于表单验证、提示信息显示或样式调整。
1. 使用JavaScript绑定focus和blur事件
可以通过JavaScript为表单元素绑定焦点获取与失去事件。以下是一个简单的例子：
在这个例子中，当用户点击输入框时，边框变为蓝色；当点击页面其他地方时，边框恢复原色。
2. 在HTML中直接使用内联事件（不推荐但可用）
也可以在HTML标签中直接使用onfocus和onblur属性：
立即学习“前端免费学习笔记（深入）”；
这种方式虽然简单，但不利于代码维护，建议将JavaScript逻辑分离到外部脚本中。
3. 实际应用场景：实时验证与提示
焦点事件常用于表单的实时校验。例如，在用户填写邮箱后失去焦点时检查格式是否正确：
4. 注意事项
某些元素默认不能获取焦点，如普通div或span。如果需要让它们响应focus事件，需添加tabindex属性：
我可以获得焦点
基本上就这些。focus和blur是表单交互中最基础也最实用的事件之一，合理使用可以显著提升用户体验。
