addData()
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=<device-width>, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<script>
var db = window.indexedDB || window.mozIndexedDB || window.webkitIndexedDB || window.msIndexedDB;
var request,
result,
version = 4;
var dbName = 'testDB',
osName = 'os1';
function createDB() {
request = db.open(dbName, version); //调用indexedDB.open方法就可以创建或者打开一个indexedDB数据库 得到的是IDBOpenDBRequest对象赋值给request
request.onsuccess = function() { //IDBOpenDBRequest接口定义onsuccess请求成功的回调函数句柄
db = request.result;
console.log('opensuccess');
}
request.onerror = function(e) { //IDBOpenDBRequest接口定义onerror请求失败的回调函数句柄
console.log(e.currentTarget.errormessage); //e代表event对象，里面包含数据库的信息。
}
request.onupgradeneeded = function() { //IDBOpenDBRequest接口定义onupgradeneeded数据库版本变化的回调函数句柄
db = request.result;
//创建表objectstorage
if (!db.objectStoreNames.contains(osName)) { //判断打开的indexDB数据库中的objectStorage中是否含有名称为osName的objectStorage
db.createObjectStore(osName, {
keypath: 'id' //以id作为主键类型 使用数据中的id字段作为key值
//autoIncrement: true 如果没有名称为osName的objectStorage，创建ObjectStorage，键值为自增型
})
}
}
}
createDB();
//存入数据 save data
//json数据格式
/* 数据在名称/值对中 名称/值对包括字段名称（在双引号中），后面写一个冒号，然后是值
数据由,分隔
{}保存对象
[]保存数组
*/
var data = [{
name: '史莱姆',
id: '001',
hp: 3,
category: ['怪物', '容易逃跑'] //data中加上category
}, {
name: '小蝙蝠',
id: '002',
hp: 5,
category: ['怪物', '飞行']
}, {
name: '小恶魔',
id: '003',
hp: 9,
category: ['怪物', '恶魔']
}]
//向objectstore添加数据
function addData() {
var transaction = db.transaction(osName, 'readwrite');
// 创建一个事务transaction （需要操作的objectstore的名称（多个名称可用数组[]），事务的模式）
//数据库和表之间需要事务transaction做桥梁
var store = transaction.objectStore(osName); // 获取名为osName的objectStore
for (var i = 0; i < data.length; i++) { //循环数据
store.add(data[i]); //运用add方法将数据加入到objectstore中
}
}
//增删查改方法
function getData(id) {
var transaction = db.transaction(osName, 'readwrite'); //创建一个事务
store = transaction.objectStore(osName); // 获取名为osName的objectStore
var request = store.get(id); //get 返回IDBRequest对象
request.onsuccess = function() {
console.log(request.result);
}
}
function getAllData() {
var transaction = db.transaction(osName, 'readwrite'); //创建一个事务
store = transaction.objectStore(osName); // 获取名为osName的objectStore
var request = store.getAll(); //getAll 返回IDBRequest对象
request.onsuccess = function() {
console.log(request.result);
}
}
function updateData(id) {
var transaction = db.transaction(osName, 'readwrite'); //创建一个事务
store = transaction.objectStore(osName); // 获取名为osName的objectStore
var request = store.get(id); //update 返回IDBRequest对象
request.onsuccess = function() {
var result = request.result;
request = store.put({ //使用put方法可以增加数据也可以修改数据
name: '吸血鬼',
id: id,
hp: 9,
category: ['怪物', '恶魔']
})
}
}
function deleteData(id) {
var transaction = db.transaction(osName, 'readwrite'); //创建一个事务
store = transaction.objectStore(osName); // 获取名为osName的objectStore
var request = store.delete(id); //delete 返回IDBRequest对象
request.onsuccess = function() {
console.log('delete success');
}
}
function clear() {
var transaction = db.transaction(osName, 'readwrite'); //创建一个事务
store = transaction.objectStore(osName); // 获取名为osName的objectStore
var request = store.clear(); //clear 返回IDBRequest对象
request.onsuccess = function() {
console.log('clear success');
}
}
</script>
</body>
</html>
可以添加数据库 可以创建表，但是添加数据就出问题了
正在回答 回答被采纳积分+1
找到问题所在，已解决。
相似问题
登录后可查看更多问答，登录/注册
- 参与学习 人
- 提交作业 467 份
- 解答问题 4826 个
本路径带你通过系统学习HTML5、JavaScript、jQuery的进阶知识，不仅如此，还会学习如何利用组件化的思想来开发网页，知识点+案例，使得所学可以更好的得到实践。
了解课程
恭喜解决一个难题，获得1积分~
来为老师/同学的回答评分吧
0 星