用<input type="text">创建单行文本框需显式声明type、必配name属性、加id并关联label；type="search"语义不同，自带清除按钮且Enter不默认提交；name缺失或含空格/点号会导致提交失败；autocomplete和autocapitalize提升移动端输入体验。
怎么用 <input> 创建文本输入框
直接写 <input type="text"> 就行，这是最基础的单行文本框。浏览器默认渲染为带边框的空白区域，用户能键入、编辑、选中文字。
注意：不写 type 属性时，部分老浏览器会按 "text" 处理，但现代规范要求显式声明，否则可能触发严格模式警告或影响可访问性（如屏幕阅读器识别不准）。
-
type="text"是唯一安全的默认值，别依赖隐式行为 - 必须配
name属性，否则表单提交时这个字段不会被发送 - 加
id并关联<label for="xxx">，不然点击标签无法聚焦输入框
type="search" 和 type="text" 有啥区别
视觉上几乎一样，但语义和行为不同：type="search" 告诉浏览器“这是搜索场景”，会自动添加清除按钮（×）、可能启用搜索历史下拉，Safari 还会圆角加阴影。
关键差异在行为层面：
立即学习“前端免费学习笔记（深入）”；
- 按下 Enter 时，
type="search"默认不触发表单提交（除非父级是<form>且没阻止默认行为） - 某些浏览器对
type="search"禁用拼写检查（可手动用spellcheck="true"开启） - 移动端键盘可能显示“搜索”而非“回车”，提升用户体验
为什么 type="text" 提交后收不到值
常见原因是漏了 name 属性，或者 name 值为空、含非法字符（如空格、点号），导致后端解析失败或被忽略。
另一个高频坑是用了 id 当作提交标识——id 只用于 DOM 定位和 label 关联，和表单数据无关。
- 检查 HTML 中是否写了
<input name="username">，而不是只有id="username" - 避免
name="user name"（含空格）或name="user.name"（点号在部分框架里需特殊处理） - 如果用 JavaScript 动态创建，确认
el.name = "xxx"已赋值，且元素已插入文档流
要不要加 autocomplete 和 autocapitalize
要，尤其对移动设备和表单体验敏感的场景。它们不改变功能，但直接影响用户输入效率和错误率。
autocomplete 是告诉浏览器“这字段存过什么”，比如 autocomplete="email" 会让键盘弹出 @ 符号快捷键；autocomplete="off" 并不总生效（现代浏览器会忽略它来保障密码类字段的安全填充）。
- 常用值：
"on"（启用）、"off"（建议关闭，但不强制）、"email"、"tel"、"current-password" -
autocapitalize="sentences"在 iOS 上控制首字母大写逻辑，"none"可禁用自动大写（适合验证码、用户名等） - 这两个属性对桌面端影响小，但对 iOS/Android 键盘提示很实在，别省
name 和 autocomplete 的组合校验——看着能输能提交，但后端日志里字段始终为空，八成是这两处漏了。 
