IndexedDB是HTML5中用于浏览器内持久化存储大量结构化数据的低级API，支持事务操作，适用于需要离线功能的复杂应用。通过indexedDB.open()方法可创建或打开数据库，若数据库版本更新或首次创建会触发onupgradeneeded事件，在此可定义对象仓库（object store）和索引。例如创建“users”表并设置主键“id”，添加name和email索引。数据操作需在事务中进行：使用transaction()开启读写事务，调用add()插入数据，注意主键冲突；通过get()按主键查询，或利用索引index()实现条件查找；更新用put()覆盖原记录，删除用delete()移除指定主键数据；还可通过openCursor()遍历所有数据。所有操作均为异步，依赖事件回调处理结果，建议封装为Promise以提升代码可维护性。
HTML5中的IndexedDB是一种在用户浏览器中存储大量结构化数据的低级API，适合处理需要离线使用的复杂应用。它支持事务型操作，能高效地对数据进行增删改查。下面介绍如何使用IndexedDB进行基本的数据库操作。
创建或打开数据库
使用indexedDB.open()方法可以打开一个已有数据库，若不存在则会创建一个新的。
示例代码：
let request = indexedDB.open("MyDatabase", 1);
request.onerror = function(event) {
console.log("无法打开数据库");
};
request.onsuccess = function(event) {
db = event.target.result;
console.log("数据库打开成功");
};
首次创建时，会触发onupgradeneeded事件，在该事件中定义数据表（object store）和索引。
立即学习“前端免费学习笔记（深入）”；
例如：
request.onupgradeneeded = function(event) {
let db = event.target.result;
let objectStore = db.createObjectStore("users", { keyPath: "id" });
objectStore.createIndex("name", "name", { unique: false });
objectStore.createIndex("email", "email", { unique: true });
};
这里创建了一个名为“users”的对象仓库，主键为“id”，并添加了两个索引。
添加数据（新增记录）
插入数据需在事务中进行。先开启一个读写事务，再获取对象仓库，调用add()方法。
示例：
十天学会易语言图解教程用图解的方式对易语言的使用方法和操作技巧作了生动、系统的讲解。需要的朋友们可以下载看看吧！全书分十章，分十天讲完。 第一章是介绍易语言的安装，以及运行后的界面。同时介绍一个非常简单的小程序，以帮助用户入门学习。最后介绍编程的输入方法，以及一些初学者会遇到的常见问题。第二章将接触一些具体的问题，如怎样编写一个1+2等于几的程序，并了解变量的概念，变量的有效范围，数据类型等知识。其后，您将跟着本书，编写一个自己的MP3播放器，认识窗口、按钮、编辑框三个常用组件。以认识命令及事件子程序。第
function addUser(db, user) {
let transaction = db.transaction(["users"], "readwrite");
let store = transaction.objectStore("users");
let request = store.add(user);
request.onsuccess = function() {
console.log("用户添加成功");
};
request.onerror = function() {
console.log("添加失败，可能主键冲突");
};
}
调用方式：addUser(db, {id: 1, name: "张三", email: "zhang@example.com"})
读取数据（查询记录）
通过主键读取单条数据：
function getUserById(db, id) {
let transaction = db.transaction(["users"]);
let store = transaction.objectStore("users");
let request = store.get(id);
request.onsuccess = function() {
if (request.result) {
console.log("找到用户:", request.result);
} else {
console.log("未找到用户");
}
};
}
使用索引查询：
let index = store.index("name");
index.get("张三").onsuccess = function(event) {
console.log("通过姓名查到:", event.target.result);
};
更新和删除数据
更新一条记录使用put()方法，会根据主键覆盖原有数据：
let transaction = db.transaction(["users"], "readwrite");
let store = transaction.objectStore("users");
store.put({id: 1, name: "李四", email: "li@example.com"});
删除数据使用delete()方法：
store.delete(1); // 删除主键为1的记录
也可通过游标遍历所有数据：
let cursorRequest = store.openCursor();
cursorRequest.onsuccess = function(event) {
let cursor = event.target.result;
if (cursor) {
console.log("遍历:", cursor.value);
cursor.continue();
}
};
基本上就这些。掌握这些基础操作后，就能在前端实现本地持久化存储。注意所有操作都是异步的，需通过事件回调处理结果。不复杂但容易忽略错误处理和事务边界。实际开发中建议封装成Promise风格更便于使用。
