1. 增加数据
// 打开数据库 const dbName = 'myDatabase'; const request = indexedDB.open(dbName, 1); // 数据库被新建或升级时创建对象存储空间 request.onupgradeneeded = event => { const db = event.target.result; const objectStore = db.createObjectStore('customers', { keyPath: 'id' }); objectStore.createIndex('name', 'name', { unique: false }); objectStore.createIndex('email', 'email', { unique: true }); }; // 成功打开数据库 request.onsuccess = event => { const db = event.target.result; // 添加数据到对象存储空间 const transaction = db.transaction(['customers'], 'readwrite'); const objectStore = transaction.objectStore('customers'); objectStore.add({ id: 1, name: 'Alice', email: 'alice@example.com' }); objectStore.add({ id: 2, name: 'Bob', email: 'bob@example.com' }); transaction.oncomplete = () => { console.log('Data added successfully'); }; // 打开数据库失败 request.onerror = event => { console.log('Error opening database', event.target.error); };
2. 修改数据
// 打开数据库 const request = window.indexedDB.open('myDatabase', 1); request.onerror = function(event) { console.log('打开数据库失败'); }; request.onsuccess = function(event) { const db = event.target.result; // 创建事务并获取数据存储对象 const transaction = db.transaction(['dataStore'], 'readwrite'); const objectStore = transaction.objectStore('dataStore'); // 指定要修改的键值(假设你想修改 title 为 '测试1' 的数据) const key = '测试1'; // 使用 get 方法获取要修改的数据 const getRequest = objectStore.get(key); getRequest.onsuccess = function(event) { const data = event.target.result; // 修改数据(假设你想修改 content 字段) data.content = '这是修改后的内容'; // 使用 put 方法将修改后的数据写回数据库 const putRequest = objectStore.put(data); putRequest.onsuccess = function(event) { console.log('数据修改成功'); }; putRequest.onerror = function(event) { console.log('数据修改失败'); }; }; getRequest.onerror = function(event) { console.log('获取数据失败'); }; transaction.oncomplete = function(event) { console.log('事务完成'); db.close(); }; transaction.onerror = function(event) { console.log('事务出错'); }; }; request.onupgradeneeded = function(event) { const db = event.target.result; // 创建对象存储空间 const objectStore = db.createObjectStore('dataStore', { keyPath: 'title' }); // 可以在这里添加索引等其他设置 };
3.修改数据
// 打开数据库 const request = window.indexedDB.open('myDatabase', 1); request.onerror = function(event) { console.log('打开数据库失败'); }; request.onsuccess = function(event) { const db = event.target.result; // 创建事务并获取数据存储对象 const transaction = db.transaction(['dataStore'], 'readwrite'); const objectStore = transaction.objectStore('dataStore'); // 指定要修改的键值(假设你想修改 title 为 '测试1' 的数据) const key = '测试1'; // 使用 get 方法获取要修改的数据 const getRequest = objectStore.get(key); getRequest.onsuccess = function(event) { const data = event.target.result; // 修改数据(假设你想修改 content 字段) data.content = '这是修改后的内容'; // 使用 put 方法将修改后的数据写回数据库 const putRequest = objectStore.put(data); putRequest.onsuccess = function(event) { console.log('数据修改成功'); }; putRequest.onerror = function(event) { console.log('数据修改失败'); }; }; getRequest.onerror = function(event) { console.log('获取数据失败'); }; transaction.oncomplete = function(event) { console.log('事务完成'); db.close(); }; transaction.onerror = function(event) { console.log('事务出错'); }; }; request.onupgradeneeded = function(event) { const db = event.target.result; // 创建对象存储空间 const objectStore = db.createObjectStore('dataStore', { keyPath: 'title' }); // 可以在这里添加索引等其他设置 };
4. 查询数据
// 打开数据库 const dbName = 'myDatabase'; const request = indexedDB.open(dbName, 1); // 数据库被新建或升级时创建对象存储空间 request.onupgradeneeded = event => { const db = event.target.result; const objectStore = db.createObjectStore('customers', { keyPath: 'id' }); objectStore.createIndex('name', 'name', { unique: false }); objectStore.createIndex('email', 'email', { unique: true }); }; // 成功打开数据库 request.onsuccess = event => { const db = event.target.result; // 获取数据 const transaction = db.transaction(['customers'], 'readonly'); const objectStore = transaction.objectStore('customers'); // 获取所有数据 const getAllRequest = objectStore.getAll(); getAllRequest.onsuccess = () => { console.log(getAllRequest.result); }; // 通过主键获取数据 const getRequest = objectStore.get(1); getRequest.onsuccess = () => { console.log(getRequest.result); }; // 通过索引获取数据 const index = objectStore.index('email'); const getEmailRequest = index.get('bob@example.com'); getEmailRequest.onsuccess = () => { console.log(getEmailRequest.result); }; // const index = objectStore.index("introduce"); // const getEmailRequest = index.openCursor(IDBKeyRange.only("暂无介绍")); // getEmailRequest.onsuccess = () => { // const cursor = getEmailRequest.result; // if (cursor) { // console.log(cursor.value); // cursor.continue(); // } // }; transaction.oncomplete = () => { console.log('Data retrieval completed'); db.close(); }; }; // 打开数据库失败 request.onerror = event => { console.log('Error opening database', event.target.error); };