HTML5 Web SQL Database 数据库的使用方法【图文说明】
页面代码：
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title></title> <meta charset="utf-8" /> <script src="../js/jquery-1.10.2.min.js"></script> <script type="text/javascript"> $(function () { //var db = window.openDatabase("Web Sql DB"); //判断浏览器是否支持 if(window.openDatabase) { //alert("浏览器支持"); //创建数据库 var db = window.openDatabase("Web_Sql_DB", "1.0", "Web SQL DB 测试", 20000); if(db) { //alert("数据库创建成功！"); //创建表 db.transaction(function (tx) { tx.executeSql("Create Table tb1(id int,title Text)"); }); //插入数据 db.transaction(function (tin) { tin.executeSql("insert into tb1(id,title) values(?,?)",[2,"WEB SQL"]); }) db.transaction(function (tin) { tin.executeSql("insert into tb1(id,title) values(?,?)", [3, "JQuery"]); }) //删除 //db.transaction(function (tin) { // tin.executeSql("delete from tb1 where title='WEB SQL'"); //}) //查询 db.transaction(function (tx) { tx.executeSql("select * from tb1", [], function (x1, x2) { for(var i=0;i<x2.rows.length;i++) { document.write("<b>" + x2.rows.item(i)['title'] + "</b><br/>") } }, function (x3) { }); }) } } else { alert("浏览器 不 支持！！！"); } }) </script> </head> <body> Test Web SQL </body> </html>
执行结果：(由于刷新多次浏览器，导致重复数据)