赞
踩
IndexedDB是一种客户端NoSQL数据库,它可以在JavaScript中使用键值对存储和检索数据。
## 创建数据库和存储对象 在使用IndexedDB之前,需要先创建一个数据库和一个存储对象。
可以使用下面的方法来创建:
- var request = window.indexedDB.open('mydb', 1); //创建数据库
-
- request.onerror = function(event) {
-
- console.log('Database error: ' + event.target.errorCode); //发生错误
-
- };
-
- request.onupgradeneeded = function(event) {
-
- var db = event.target.result;
-
- var objectStore = db.createObjectStore('users', { keyPath: 'id' }); //创建存储对象
-
- };
-
- request.onsuccess = function(event) { var db = event.target.result; };
在这个示例中,我们使用indexedDB.open方法创建了名为mydb的数据库。
在数据库版本号为1的情况下,我们在onupgradeneeded事件中使用createObjectStore方法创建了名为users的存储对象,并使用id字段作为主键。
- var transaction = db.transaction(['users'], 'readwrite'); //开启事务
-
- var objectStore = transaction.objectStore('users'); //指定操作存储对象
-
- var request = objectStore.add({ id: 1, name: 'Tom', age: 25 }); //添加数据
-
- request.onsuccess = function(event) { console.log('Data added.'); };
-
- request.onerror = function(event) { console.log('Data not added: ' + event.target.errorCode); };
在这个示例中,我们使用add方法将一条包含id、name和age字段的数据添加到名为users的存储对象中。
- var transaction = db.transaction(['users'], 'readwrite'); //开启事务
-
- var objectStore = transaction.objectStore('users'); //指定操作存储对象
-
- var request = objectStore.put({ id: 1, name: 'Tom', age: 30 }); //更新数据
-
- request.onsuccess = function(event) { console.log('Data updated.'); };
-
- request.onerror = function(event) { console.log('Data not updated: ' + event.target.errorCode); };
在这个示例中,我们使用put方法将一条包含id、name和age字段的数据更新到名为users的存储对象中。
## 删除数据 可以使用以下方法来从存储对象中删除数据:
- var transaction = db.transaction(['users'], 'readwrite'); //开启事务
-
- var objectStore = transaction.objectStore('users'); //指定操作存储对象
-
- var request = objectStore.delete(1); //删除数据
-
- request.onsuccess = function(event) { console.log('Data deleted.'); };
-
- request.onerror = function(event) { console.log('Data not deleted: ' + event.target.errorCode); };
在这个示例中,我们使用delete方法从名为users的存储对象中删除了id为1的数据。
- var transaction = db.transaction(['users'], 'readonly'); //开启只读事务
-
- var objectStore = transaction.objectStore('users'); //指定操作存储对象
-
- var request = objectStore.get(1); //查询数据
-
- request.onsuccess = function(event) {
-
- var data = event.target.result;
-
- if (data) { console.log(data.id + ' ' + data.name + ' ' + data.age); } };
- request.onerror = function(event) { console.log('Data not found: ' + event.target.errorCode); };
在这个示例中,我们使用get方法从名为users的存储对象中查询了id为1的数据,并输出了查询结果。 以上就是IndexedDB的基本操作。需要注意的是,IndexedDB是一种较新的技术,可能不兼容一些旧的浏览器,需要进行兼容性检查。
Copyright © 2003-2013 www.wpsshop.cn 版权所有,并保留所有权利。