1.html5以来，数据的前端存储已经有了很大进步。这里简单些一下webSQL的基本用法。代码如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>web sql</title>
</head>
<body> <script>
var db = window.openDatabase("myData","1.0","我的数据库","20000"); //参数分别是，数据库名，版本号，描述信息，大小
if(db){
alert("数据库已经创建")
}
db.transaction(function(tx){
tx.executeSql("create TABLE test(id int unique,age int)")
}); //插入
db.transaction(function(tx){
tx.executeSql("insert into test(id,age) values(?,?)",["HTML5",20])
});
db.transaction(function(tx){
tx.executeSql("insert into test(id,age) values(?,?)",["javascript",18])
});
//查询
db.transaction(function(tx){
tx.executeSql("select * from test",[],function(tx,rs){
for(var i = 0;i<rs.rows.length;i++){
document.write("第"+(i+1)+"个数据：" +rs.rows.item(i)["id"]+"<br><br>");
//取到的数据是item，中括号字段表示取那个字段的数据。
}
},function(err){
console.log("Err",err)
})
}); //删除
db.transaction(function(tx) {
tx.executeSql("delete from test where id=?", ["HTML5"], function(tx, result) {
document.write("删除了id = "+"HTML5"+" 的数据"+"<br><br>");
}, function(tx, error) {
log("错误：" + error.Message);
});
}) //再次查询
db.transaction(function(tx){
tx.executeSql("select * from test",[],function(tx,rs){
for(var i = 0;i<rs.rows.length;i++){
document.write("第"+(i+1)+"个数据：" +rs.rows.item(i)["id"]+"<br><br>");
//取到的数据是item，中括号字段表示取那个字段的数据。
}
},function(err){
console.log("Err",err)
})
});
</script>
</body>
</html>