1.html5以来，数据的前端存储已经有了很大进步。这里简单些一下webSQL的基本用法。代码如下：
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <meta charset="UTF-8">
5 <title>web sql</title>
6 </head>
7 <body>
8
9 <script>
10 var db = window.openDatabase("myData","1.0","我的数据库","20000"); //参数分别是，数据库名，版本号，描述信息，大小
11 if(db){
12 alert("数据库已经创建")
13 }
14 db.transaction(function(tx){
15 tx.executeSql("create TABLE test(id int unique,age int)")
16 });
17
18 //插入
19 db.transaction(function(tx){
20 tx.executeSql("insert into test(id,age) values(?,?)",["HTML5",20])
21 });
22 db.transaction(function(tx){
23 tx.executeSql("insert into test(id,age) values(?,?)",["javascript",18])
24 });
25 //查询
26 db.transaction(function(tx){
27 tx.executeSql("select * from test",[],function(tx,rs){
28 for(var i = 0;i<rs.rows.length;i++){
29 document.write("第"+(i+1)+"个数据：" +rs.rows.item(i)["id"]+"<br><br>");
30 //取到的数据是item，中括号字段表示取那个字段的数据。
31 }
32 },function(err){
33 console.log("Err",err)
34 })
35 });
36
37
38 //删除
39 db.transaction(function(tx) {
40 tx.executeSql("delete from test where id=?", ["HTML5"], function(tx, result) {
41 document.write("删除了id = "+"HTML5"+" 的数据"+"<br><br>");
42 }, function(tx, error) {
43 log("错误：" + error.Message);
44 });
45 })
46
47
48 //再次查询
49 db.transaction(function(tx){
50 tx.executeSql("select * from test",[],function(tx,rs){
51 for(var i = 0;i<rs.rows.length;i++){
52 document.write("第"+(i+1)+"个数据：" +rs.rows.item(i)["id"]+"<br><br>");
53 //取到的数据是item，中括号字段表示取那个字段的数据。
54 }
55 },function(err){
56 console.log("Err",err)
57 })
58 });
59 </script>
60 </body>
61 </html>
时间： 2024-10-14 02:08:30