IndexedDB是浏览器内置支持事务的NoSQL数据库，适合缓存文章详情等结构化数据：先用indexedDB.open()创建数据库并监听upgradeneeded建对象仓库（如"articles"）和索引（如"byPubTime"），再通过readwrite事务调用put()存储JSON数据，用get()/getAll()读取，配合网络请求实现“先查缓存、未命中再拉取并回填”的策略，升级版本时在upgradeneeded中迁移旧数据。
IndexedDB 是浏览器内置的、支持事务的 NoSQL 数据库，适合存储结构化数据（比如文章详情），尤其适合离线场景。要缓存网页抓取的文章详情，核心是：创建数据库 → 定义对象仓库 → 存储/读取 JSON 格式的详情数据 → 配合网络请求做缓存策略（如先查缓存，再更新）。
创建并打开 IndexedDB 数据库
用 indexedDB.open() 创建或打开数据库，指定版本号。首次打开时触发 upgradeneeded 事件来建表（即对象仓库）：
- 数据库名建议唯一，如
"articleCache" - 对象仓库（object store）命名建议语义化，如
"articles"，主键设为文章 ID（如id字段） - 若需按发布时间查询，可添加索引：
store.createIndex("byPubTime", "pubTime", { unique: false })
存储文章详情数据
文章详情通常是 JSON 对象（含 title、content、author、pubTime 等字段）。写入前确保数据库已就绪（onsuccess 或 Promise 封装后）：
- 使用
transaction("articles", "readwrite")获取读写事务 - 调用
objectStore.put(articleData, articleData.id)写入；若id已存在则覆盖 - 可封装成函数，例如
saveArticle({ id: "123", title: "...", content: "..." })
读取缓存中的文章详情
优先从 IndexedDB 读取，命中则直接渲染；未命中再发起网络请求，并在获取后自动缓存：
立即学习“Java免费学习笔记（深入）”；
- 用
get(id)方法查单条：store.get("123").onsuccess = e => console.log(e.target.result) - 支持批量查多个 ID：用
getAll(IDsArray)或游标（cursor）遍历 - 查不到时返回
undefined，此时可调接口拉取，成功后再调saveArticle()回填
处理版本升级与数据迁移
后续加字段（如新增 readStatus）、改主键或重构结构，必须升级版本号并监听 upgradeneeded：
- 旧版数据库会自动关闭，新版事务中可读旧数据、写新结构
- 例如：从 v1 升到 v2，可在
event.oldVersion === 1时遍历旧数据，补全新字段再 put 到新 store - 避免直接删库重建，否则用户已有缓存丢失
不复杂但容易忽略：记得所有 IndexedDB 操作都是异步的，推荐用 Promise 封装（如用 idb 库或手写 promisify），避免回调地狱；同时注意错误捕获（onerror / transaction.onabort），特别是存储超限时（如 Chrome 默认配额约 50% 磁盘空间，但单 origin 通常几 GB）。
