关于IndexedDB的操作文档
创始人
2025-06-01 07:53:00
0

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是一种较新的技术,可能不兼容一些旧的浏览器,需要进行兼容性检查。

相关内容

热门资讯

机构警告AI芯片热潮风险,超威... 5月7日,据央视财经,隔夜超威半导体公司(AMD)股价飙升近19%,带动AI芯片热潮持续升温。AMD...
银行员工转走储户1800万最新... 银行员工转走储户1800万最新进展:2名储户已收到银行全部款项
原创 中... 1994年,安徽省的经济格局曾发生过一次戏剧性的转折。在那一年,一座名为安庆的城市,其国内生产总值(...
昆都仑区:政策“蓄力”消费焕新 “一台5000多元的空调,叠加‘国补’和商场的以旧换新活动,能优惠1000元左右,旧机还能免费上门拆...
乐悦置业竞得佛山顺德乐从镇一商... 观点网讯:5月6日,佛山市顺德区乐从镇一商业地块成功出让,由广东省乐悦置业有限公司竞得,乐从南区·邻...
原创 亦... 《爱情没有神话》这部剧,一开始的命运颇为多舛,经历了几次撤档的波折后,终于在观众面前亮相,但其首播的...
美联储34年最大分歧叠加油价飙... 美联储按预期维持利率不变,但内部出现34年来最严重分歧,叠加布油创2022年6月以来新高,美债遭抛售...
支付宝消费券回收后,资金是否支... 摘要: 支付宝消费券回收变现后,资金能否直接转入信用卡?本文解答到账方式的相关规则,帮助用户了解资金...
中医介绍5个化痰穴位!收藏这篇... 很多人忽略了“痰”的危害,觉得咳几下就没事,殊不知,肺里的痰长期堆积,只会一步步加重身体负担。 中医...
黄金平台“杰我睿”涉嫌经济犯罪... 红星资本局5月7日消息,深圳水贝知名金店“杰我睿”兑付困难事件有了新进展。日前,深圳市公安局罗湖分局...
多地出台购房新政促楼市升温 记... 今年的“五一”假期,伴随着多个城市楼市新政密集落地,在叠加市场信心持续修复的作用下,房地产市场热度持...
谁是五一“吸金王”?这5座城市... 来源:市场资讯 (来源:21城市观) 哪座城市成为“五一”假期的大赢家? 图源:摄图网 作者|赵晓...
“低招低裁”格局稳固劳动力市场... 智通财经APP获悉,美国上周初请失业金人数在经历前一周回落至近几十年来最低水平后出现小幅反弹,表明尽...
刚刚,纳指冲破26000点,创... 记者|杜宇 编辑|何小桃 杜恒峰 校对|陈俊杰 5月7日晚,纳斯达克综合指数向上触及26000点,创...
美股芯片股,集体下跌 新闻荐读 5月7日,美股三大指数小幅高开,道指涨0.3%,纳指涨0.15%,标普500指数涨0.09...
DeepSeek 估值 450... DeepSeek 首轮融资曝光,估值 450 亿美元 据《金融时报》报道,多家机构目前正寻求领投 D...
焦点复盘沪指缩量收涨录得日线六... 财联社5月7日讯,今日100股涨停,31股炸板,封板率76%。金螳螂12天10板,中国长城、福达合金...
全球的“聪明钱”正集体涌入这7... 来源:虎嗅APP 当我们在谈论美股的“科技七姐妹”(Magnificent Seven)时,一场更...
单季亏超10亿元、偿付能力告急... 2026年一季度,幸福人寿保险业务收入97.38亿元,同比增长17.31%,跑赢了行业平均增速。但净...
债券市场“科技板”开闸一年:浙... 2025年10月29日,对绍兴越城区的芯联集成而言颇为特别。这家为汽车、新能源、工控、家电等领域提供...