type="search"是启用搜索语义的硬性前提，支持清除按钮、历史建议和搜索引擎快捷入口；autocomplete="search"无效，name属性（如name="q"）和inputmode="search"才真正影响行为。
search 输入框必须用 type="search"，不是 type="text"
浏览器只在 type="search" 时才启用搜索语义：唤出带清除按钮的软键盘（iOS/Android）、支持历史建议、触发搜索引擎快捷入口。写成 type="text" 即使加 autocomplete="search"，也基本无效——后者仅是弱提示，Chrome 和 Safari 都会忽略。
常见错误：<input type="text" autocomplete="search"> → 没清除按钮、无搜索历史、不联动系统搜索服务。
-
type="search"是硬性前提，autocomplete只是辅助 - 移动端 iOS Safari 对
type="search"的清除按钮样式控制力极强，改appearance: none后需手动重绘，否则按钮消失 - 不要给
type="search"加autocomplete="off"：它本就不存输入历史（除非显式设为on），加了反而干扰语义
清除按钮的兼容写法与隐藏风险
原生清除按钮在 Chrome/Safari 中默认存在，但行为不一致：::-webkit-search-cancel-button 仅限 WebKit，Firefox 不支持；强行用 appearance: none 而不补交互逻辑，会导致用户无法清空输入。
安全做法是保留原生按钮，仅微调样式：
立即学习“前端免费学习笔记（深入）”；
- 用
input[type="search"]::-webkit-search-cancel-button控制尺寸和背景图，别设display: none - Firefox 下清除按钮不可见，但
Enter提交 + 手动选中删除仍是用户习惯，不必强求视觉统一 - 若真要自定义清除图标，必须绑定
click事件并清空value，且确保focus时不遮挡光标
autocomplete="search" 的真实作用很有限
autocomplete="search" 不是开关，也不触发历史填充——它只是告诉浏览器“这个字段用于搜索”，实际效果几乎为零。WHATWG 规范未定义该值为有效 token，Chrome 和 Safari 均不据此匹配历史记录。
真正影响搜索建议的是：name 属性值（如 name="q" 或 name="search"）+ 用户本地搜索历史 + 页面 URL 上下文。浏览器不会读取 autocomplete="search" 来拉取候选词。
- 想禁用搜索建议？靠
autocomplete="off"无效，现代浏览器已无视该值 - 想增强建议？确保
name语义清晰（如name="q"），并让表单有明确action（如/search） - 不要把
autocomplete="search"当作“开启搜索自动补全”的开关，它没这功能
移动端键盘与 inputmode 的协同要点
仅靠 type="search" 无法保证弹出纯字母键盘——iOS 默认仍可能带数字行。需配合 inputmode 显式声明输入意图：
-
inputmode="search"：iOS 弹出带搜索键的键盘（✅ 最佳实践） -
inputmode="text"：基础文本键盘，无搜索键 - 避免
inputmode="numeric"或type="number"：会强制数字键盘，破坏搜索体验 -
spellcheck="false"可关掉拼写红线，但别滥用——对中文搜索无影响，对英文搜索可能降低纠错能力
动态插入的 search 输入框最容易漏掉 inputmode，它必须和 type 一起写在初始 DOM 中，JS 后补无效。
