必须为文本输入框设置name、id及关联label以确保可访问性和功能完整：name用于后端接收数据，id需与label的for属性一致以支持点击聚焦，禁用中文或空格命名id，placeholder不可替代label，应配合aria-describedby等增强语义。
直接用 <input type="text"> 就能创建单行文本输入框，但只写这一句远远不够——它可能无法被屏幕阅读器识别、点击标签不聚焦、提交时字段丢失、移动端体验差。关键是要配齐语义和可访问性要素。
必须设置 name 和 id，并绑定 label
name 是表单提交时后端接收数据的字段名，缺了就等于没传值；id 要和
- 正确写法：
<label for="email_input">邮箱地址</label><input type="text" id="email_input" name="email"> - 错误示例：漏掉 name、id 和 for 不匹配、用空格或中文命名 id（如
id="用户邮箱"） - id 推荐用下划线或中划线，比如
id="first_name"或id="phone-number"，避免以数字开头
别把 placeholder 当标签用
placeholder 是辅助提示，不是语义标签。它在用户开始输入后就消失，对视障用户不可见，也无法被读屏软件作为控件描述读出。
- 真正需要提示时，把说明文字放进
- 如果提示信息较复杂，可用
aria-describedby关联额外说明元素
合理使用 autocomplete 和 required
autocomplete 不只是“自动补全”，它影响密码管理器行为、浏览器填充逻辑，甚至决定调出哪种软键盘。
- 邮箱框设
autocomplete="email"，姓名拆成autocomplete="given-name"和autocomplete="family-name" - 验证码、临时口令等敏感字段，用
autocomplete="off"或更稳妥的autocomplete="new-password" - 加
required后，需配合视觉反馈（如边框变红）或 JS 监听invalid事件并设置aria-invalid="true"，否则用户不知道哪里错了
其他实用属性别忽略
这些属性虽非必需，但在实际项目中常能省去不少 JS 逻辑。
-
maxlength控制最大字符数，防止超长提交 -
autofocus让页面加载后自动聚焦，适合登录页首字段 -
readonly允许显示和提交值，但禁止编辑；disabled则连提交都跳过 -
value设初始值，注意它和 placeholder 不能同时起作用（value 优先）
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
