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);
};