在 HTML5 中已被完全移除,因其语义模糊、不可控、无无障碍支持且与表单标准脱节;现代搜索框应使用 并置于 内以确保语义和可访问性。

标签在 HTML5 中已被完全移除,HTML4 里它也早已被标记为过时(deprecated),现代浏览器虽可能仍能“解析”它(出于兼容性兜底),但不推荐、不保证行为一致、不能用于新项目。
为什么 被淘汰?
这个标签本意是提示浏览器显示一个搜索输入框,并把用户输入自动拼成 GET 请求发给当前页面(如 ?isindex=xxx)。问题在于:
- 语义模糊:它既不是表单控件,也不参与表单提交流程,无法设置
name、placeholder或绑定事件 - 不可控:无法自定义样式、无法获取输入值、无法阻止默认跳转
- 无无障碍支持:屏幕阅读器无法识别其用途
- 与表单标准脱节:HTML4 后期已明确用
+替代
HTML5 中怎么写搜索框?用
HTML5 引入了语义化更强的 type="search",它和普通 text 输入框渲染几乎一样,但有关键差异:
- 语义明确:告诉浏览器“这是搜索意图”,有助于键盘优化(如 iOS 搜索键盘)、语音输入识别、浏览器历史建议等
- 自带清空按钮(多数浏览器默认显示 × 图标,可通过
::-webkit-search-cancel-button自定义) - 可配合
正常提交,支持name、value、placeholder、autofocus等全部标准属性
要不要加 元素?
HTML5 确实定义了 元素,但它只是个语义容器(类似 ),不带任何默认样式或行为。它不替代 ,而是用来包裹整个搜索区域:
立即学习“前端免费学习笔记(深入)”;
注意: 在旧版 IE 中无意义,需配 CSS 或 JS 做降级;若仅需一个输入框,不用它也没问题。
真正容易被忽略的是:即使只写 ,也必须放在 内才能获得完整语义和可访问性支持——单独使用会丢失提交上下文和 label 关联能力。










