上一篇文章说过HTML5提供了代替的cookie
的简单存储,这次主要说一下本地存储的数据库。
本地数据库
1.本地数据库介绍
对于简单的数据,使用sessionStorage和localStorage能够很好地完成存取,但是对于处理复杂的关系型数据,
它就力不从心了。这也是 HTML 5 的“Web SQLDatabase
”API 接口的应用所在。我把它理解成一个Html5
环境下可以用Js执行
CRUD
的Web
数据库.
2.三个核心的方法
①openDatabase·
:这个方法使用现有数据库或创建新数据库创建数据库对象
②transaction
:这个方法允许我们根据情况控制事务提交或回滚。
③executeSql
:这个方法用于执行真实的SQL查询。
本地数据库的操作
1. 打开连接并创建数据库
var db = openDatabase("student","1.0","xuesheng",1024*1024,function(){});
参数说明:
A. 数据库名称。
B. 版本号 目前为1.0。
C. 对数据库的描述。
D. 设置数据的大小。
E. 回调函数(可省略)
2. 创建数据表
db.transaction(function(fx){
fx.executeSql(
"create table if not exists stu (id REAL UNIQUE,name TEXT)",
[],
function () {
alert("表创建成功");
},
function () {
alert("表创建失败");
}
);
});
executeSq
l函数有四个参数,其意义分别是:
1) 表示查询的字符串,使用的SQL语言是SQLite 3.6.19。
2) 插入到查询中问号所在处的字符串数据。
3) 成功时执行的回调函数。返回两个参数:tx和执行的结果。
4) 一个失败时执行的回调函数。返回两个参数:tx和失败的错误信息。
数据表添加数据
db.transaction(function(fx){
fx.executeSql(
"insert into stu (id,name) values (?,?),(?,?)",
[3,"helios",2,"syl"],
function () {
alert("数据插入成功");
},
function () {
alert("数据插入失败");
}
);
});
数据表查询数据
db.transaction(function(fx){
fx.executeSql(
"select * from stu",
[],
function (fx,result) {
var len = result.rows.length;
for(var i=0;i<len;i++) {
one.innerHTML+=result.rows.item(i)["name"]+"<br>";
}
},
function () {
alert("表创建失败");
}
);
});
参数说明:
result
是查询到的结果集,其中最重要的属性—SQLResultSetRowList 类型的 rows
是数据集的“行” 。
rows
有两个属性:length
、item
。length
代表总条数,用item(num)
,可访问到具体的行。
数据表更新数据
fx.executeSql(
"update stu set name=? where id=?",
["李四",1],
function () {
alert("数据更新成功");
},
function () {
alert("数据更新失败");
}
);
数据表删除数据
fx.executeSql(
"delete from stu where id=?",
[1],
function () {
one.innerHTML="";
alert("数据删除成功");
},
function () {
alert("删除失败");
});
删除表
db.transaction(function(fx) {
fx.executeSql(
"drop table stu",
[],
function () {
alert("表删除成功");
},
function () {
alert("表删除失败");
}
);
})