HTML5新增输入类型优化表单体验。1. email：限制邮箱格式，支持multiple，移动端显示@键盘；2. url：需包含http://或https://，移动端适配网址键盘；3. number：限定数字输入，支持min、max、step，移动端调出数字键盘；4. 其他：tel显示数字键盘，search用于搜索框，range为滑动条，color打开取色器。配合服务端验证更安全。
HTML5 引入了多种新的输入类型，用来优化表单输入体验，并提供更精确的数据验证和设备适配（比如在移动设备上显示合适的键盘）。下面介绍email、url、number等常见新增输入类型的使用方法。
1. email 类型：用于输入邮箱地址使用type="email"可以确保用户输入的是符合邮箱格式的内容。
浏览器会自动进行基本格式校验。
示例：
立即学习“前端免费学习笔记（深入）
”；
说明：
用户必须输入类似name@example.com的格式，否则提交时会提示错误。
在手机上通常会弹出带有 @ 符号的键盘，方便输入。
支持多个邮箱输入：
type="email" multiple。
2. url 类型：用于输入网址type="url"用于要求用户输入有效的 URL 地址，如 https://www.example.com。
示例：
Comet AI 浏览器下载 Comet AI 浏览器，体验由 Perplexity AI 驱动的革命性上网方式。内置 AI 助手可实时总结网页、跨标签页对比信息、自动执行任务。告别繁琐操作，让 AI 成为你的浏览副驾，大幅提升研究与工作效率。支持 Windows、macOS、Android 和 iOS。
下载
说明：
输入内容必须包含协议头，例如http://或https://，否则会被视为无效。
移动端会显示适合输入网址的键盘布局。
3. number 类型：用于输入数字type="number"限制用户只能输入数值，还支持上下调节按钮。
示例：
说明：
min和max设置数值范围。
step定义步长，如设置为 0.5 可输入小数。
移动端会调出数字键盘，提升输入效率。
4. 其他常用新增输入类型
除了以上三种，还有几个实用的类型：type="tel"：用于电话号码。不强制格式，但移动端会显示数字键盘。
示例：
type="search"：用于搜索框，视觉上可能略有不同，部分浏览器会添加清除按钮。
type="range"：以滑动条形式输入数值。
示例：
type="color"：打开颜色选择器，返回十六进制颜色值。
示例：
基本上就这些。合理使用 HTML5 新增输入类型，不仅能减少 JavaScript 验证代码，还能显著提升用户体验，特别是在移动设备上。注意在关键场景仍需服务端验证，因为前端校验可被绕过。