使用搜索输入类型能获得什么？

例如： <input type="search">

1. 您会在 Safari 中获得一个额外的圆角外观，这在一段时间内与 macOS 搜索输入的外观相匹配，但现在已经不再如此了。 我并不讨厌这种外观，除了……
2. Safari 完全忽略了您在其上设置的 font-size，因此请注意这一点。 除非您使用 -webkit-appearance: none 取消圆角外观（我想 未来将取消前缀）——然后您可以这样做，所以大概 92% 的所有网站都这样做。
3. 您会在输入框内获得一个小 × 图标（当它有值时），用于清除输入内容。 这可能是使用它的最佳理由，并且幸运的是，即使重置了 appearance，您也可以保留它。
4. 您会获得使用语义上正确的输入类型完成工作的满足感，假设您正在构建一个实际搜索某些内容的工具。
5. 您可以获得过去的搜索词自动完成功能。 浏览器会存储这些过去的搜索词，并提供一个菜单来自动完成它们。 我试图将此作为一个搜索输入独有的功能列表，并且我可以证明这在非搜索输入上也会发生。 但是，它在搜索输入上确实最合理。
6. 您可以享受向父表单添加角色的乐趣（即 <form role="search">），因为这有助于辅助技术将其宣布为搜索表单。
7. 您需要记住为输入添加一个合适的 <label>。 仅仅使用放大镜图标或 placeholder 并不够，即使很多设计在视觉上要求这样做。
8. 您会获得一个非常奇怪的 incremental 属性，该属性会向 DOM 元素本身发送一个去抖动的 search 事件。 我想这对于实时搜索 UX 很有用。 但它是非标准的，并且在 Firefox 中不可用，所以最好不要依赖它 (来自 Christian Shaefer)。
9. 您可以 继续作为一名前端开发人员工作。