网页 综合 更新时间 2026-11-13 16:39:31

HTML5 Web IndexedDB 数据库 | 菜鸟教程

自动蜘蛛 www.runoob.com 正文约 1069 字
IndexedDB 是一种基于浏览器的 NoSQL 数据库,用于在客户端持久化存储大量结构化数据。
IndexedDB 允许通过键值对存储复杂的数据对象(如对象、数组、文件等),并支持事务、索引、版本控制和复杂查询操作。
IndexedDB 是异步的,不会阻塞主线程,适合离线应用程序、缓存等场景。
IndexedDB 非常适合需要存储大量结构化数据的应用程序,尤其是那些希望支持离线模式或处理复杂查询的 Web 应用。
1、indexedDB.open():用于打开现有数据库或创建新数据库。
2、db.createObjectStore():在 onupgradeneeded 事件中创建对象存储(类似表)。
3、objectStore.add():在事务中向对象存储中添加数据。
3、objectStore.get():根据键值从对象存储中获取数据。
4、objectStore.put():更新现有记录,若记录不存在则插入。
5、objectStore.delete():根据键值删除记录。
6、db.transaction():创建事务,指定对象存储名称和事务模式(readonly 或 readwrite)。
7、objectStore.createIndex():为对象存储中的字段创建索引,以便更快的查询。
以下是一个完整的 IndexedDB 实例,用于创建数据库、插入数据、查询数据并更新数据。
离线存储:IndexedDB 允许你存储数据以便在没有网络连接时访问,这对于离线 Web 应用至关重要。
缓存:可以用于存储大量缓存数据(如文件、图片、视频),提升应用的加载速度。
复杂数据处理:适用于需要存储和处理大量结构化数据的场景,尤其是需要索引和查询功能。
本地数据库:IndexedDB 可以作为前端应用的本地数据库,存储用户数据、配置信息、应用状态等。
大容量存储:支持更大数据存储(常常可以达到几百 MB 或更多),比 localStorage 的 5MB 限制大得多。
丰富的数据操作:支持事务、索引、查询、批量处理等复杂操作。
离线支持:数据保存在用户设备上,可以离线访问并同步到服务器。
API 复杂:相比 localStorage 等简单的客户端存储,IndexedDB API 相对复杂,需要更多的代码。
异步处理:操作异步执行,初学者可能会不习惯处理回调或 Promise。
IndexedDB 非常适合需要存储大量结构化数据的应用程序,尤其是那些希望支持离线模式或处理复杂查询的 Web 应用。
访问原文 返回搜索 https://www.runoob.com/html/html5-web-api-indexeddb.html
本页为82搜索生成的网页快照,内容来自站内索引;演示数据的原文链接仅作示例。