首页 > 网站 > WEB开发 > 正文

indexDB：html5本地数据库存储

2024-04-27 15:05:02

字体：大中小

来源：转载

供稿：网友

html5新增的本地存储数据库 IndexDB，相比cookie和WebStorage更加强大，本文介绍简单的增删改查。

demo执行前： 这里写图片描述

var request = indexedDB.open('dataBase', 1);//打开/创建一个数据库，名为student，版本为1. //indexedDB.deleteDatabase('class');//删除名为class的数据库 var dbase; //第一次创建数据库或者更新数据库 request.onupgradeneeded = function() { dbase = this.result; //创建表 var store = dbase.createObjectStore('student', { keyPath: 'id' }); store.createIndex('id', 'id', { unique: true }) store.createIndex('name', 'name', { unique: false }) store.createIndex('score', 'score', { unique: false }) }; //成功打开数据库 request.onsuccess = function() { dbase = this.result; var transaction = dbase.transaction(['student'], 'readwrite'); //打开一个事务，使用‘student’ object store,以读写模式 var store = transaction.objectStore('student'); //获取student object Store var index = store.index('id');//查询索引 //添加 //添加一条数据：add()时要保证当前表内不存在要添加的id值 //当不确定时，建议使用put();put:存在时修改，不存在时添加 var resadd = store.add({ 'id': 5, 'name': 'skymobi', 'score': 75 }); resadd.onsuccess = function(){ console.log("添加成功！"); } resadd.onerror = function(e){ console.error(e.target.error); } //删除 //删除id(主键)为3的数据（请先添加数据） store.delete(3); //修改 store.put({ 'id': 4, 'name': 'surfaceStudio', 'score': 95 }); //查询所有数据 var rq = index.openCursor(); rq.onsuccess = function() { var cursor = this.result; if(cursor) { console.log(cursor.value); cursor.continue(); } } //查询单个数据 //查询id为2的数据（请先添加数据） var range = IDBKeyRange.only(2); var rqRange = index.openCursor(range); rqRange.onsuccess = function() { var cursor = rqRange.result; if(cursor) { console.info(cursor.value); } } }

执行后 这里写图片描述

更多详细API请见：https://developer.mozilla.org/en-US/docs/Web/API/IDBObjectStore

上一篇：angularJs基础（1）

下一篇：JavaScript常用对象

学习交流

硬盘分区如何设置准确的分区空间

硬盘分区如何设置准确的分区空间...

热门图片

猜你喜欢的新闻

猜你喜欢的关注

新闻热点

英伟达市值一夜大涨9246亿创2023年5月以来最大单周涨幅

2024-04-27 13:35:46

雷军：小米正在申请3万件专利，以提升自身的竞争力

2024-04-27 13:33:47

人参泡酒15年后竟“复活”？网友：这酒还能喝不？

2024-04-24 22:53:44

芯片股普涨！英伟达市值一夜大涨6000亿元

2024-04-23 19:32:50

面馆老板1天卖100碗刚够交房租要卖到150碗才能实现盈利

2024-04-23 19:25:50

跌近30%！茶百道上市一小时跌没3年净利润

2024-04-23 19:13:19

疑难解答

图片精选

网友关注