html5中没有unique属性。它既非标准表单验证属性，也不参与浏览器校验；开发者常将其与框架指令、数据库约束或indexeddb索引混淆；唯一原生接近的机制是indexeddb索引的unique:true选项，但仅限本地生效，防重复须前后端协同。

HTML5 中并没有 Unique 属性。这是一个常见误解——unique 并非 HTML5 标准中的表单或元素属性，也不参与浏览器端的数据校验或数据库索引配置。

为什么“HTML5 unique 属性”不存在？

HTML5 规范中定义的表单验证属性包括 required、min/max、pattern、step 等，但从未引入 unique。部分开发者可能混淆了以下概念：

• 某些前端框架（如 Angular、Vue 的插件）或 UI 库自定义的 unique 指令/属性；
• 后端数据库（如 MySQL、PostgreSQL）的 UNIQUE 约束；
• IndexedDB 中对象存储（Object Store）创建时通过 createIndex() 设置 unique: true 参数；
• Web Components 或自定义元素中自行实现的去重逻辑。

真正能防止重复的 Web 原生机制：IndexedDB 索引唯一性

在客户端存储场景中，唯一性控制最接近“HTML5 生态”的是 IndexedDB。它支持在创建索引时显式声明唯一约束：

• 调用 objectStore.createIndex(name, keyPath, { unique: true })；
• 当插入或更新数据时，若索引值已存在，操作将抛出 ConstraintError；
• 该机制由浏览器引擎强制执行，无需手动校验，适合离线应用保障本地数据一致性。

例如：为用户邮箱建立唯一索引，避免重复注册本地缓存记录。

防止重复需前后端协同，不能只靠前端

即使使用 IndexedDB 的 unique: true，也仅作用于当前设备本地。真实业务中防重复必须依赖服务端：

• 前端可做即时提示（如输入邮箱时检查是否已被占用），但结果不具权威性；
• 提交时仍需服务端对关键字段（如用户名、手机号）执行数据库 UNIQUE 约束校验；
• 网络延迟、多端并发、绕过前端等情况都会导致前端校验失效。

替代方案：用标准 HTML5 属性辅助基础去重体验

虽然没有 unique，但可通过组合现有特性提升用户体验：

• autocomplete="off" 避免浏览器自动填充重复值（配合动态生成的 name 属性更可靠）；
• pattern + title 引导用户按格式输入（如邮箱格式），间接降低人为重复概率；
• 结合 JavaScript 监听 input 或 blur，调用 API 实时查重并反馈（注意防抖与节流）。

前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！