一流校建设网站,网站建设及那个科目,专业长春网站建设工作室,苏州吴江建设局招标网站基于HTML5的Web DataBase 可以让你在浏览器中进行数据持久地存储管理和有效查询#xff0c;假设你的离线应用程序有需要规范化的存储功能
本文讲述如何使用核心方法openDatabase、transaction、executeSql
1.新建一个网页#xff0c;比如#xff1a;test.html 内容如下假设你的离线应用程序有需要规范化的存储功能
本文讲述如何使用核心方法openDatabase、transaction、executeSql
1.新建一个网页比如test.html 内容如下 [html] view plaincopy !DOCTYPE html html head meta http-equivContent-Type contenttext/html; charsetgbk / titleweb sql database/title script typetext/javascript srcjquery-1.4.3.js/script script typetext/javascript $(function(){ if (!window.openDatabase) { alert(不支持); } else { initDB(); createTables(); } function initDB(){ var shortName localDB; var version 1.0; var displayName localDB table; var maxSize 655350; // in bytes //window.openDatabase(数据库名字, 版本,数据库描述,数据库大小); localDB window.openDatabase(shortName, version, displayName, maxSize); } function createTables(){ var query CREATE TABLE IF NOT EXISTS user(id INTEGER NOT NULL, username TEXT NOT NULL);; try { localDB.transaction(function(transaction){ transaction.executeSql(query, [], null, null); }); } catch (e) { console.log(create table failed); alert(建表失败); return; } } }); function btnClick(){ var username $(#username).val(); try { localDB.transaction(function(transaction){ transaction.executeSql(insert into user(id,username) values(?,?), [1,username]); }); } catch (e) { console.log(insert into failed); alert(插入失败); return; } console.log(insert into success); //alert(insert into success); } function btnSelect(){ localDB.transaction(function(tx) { tx.executeSql(select * from user, [], function(tx, result) { $(#result).empty(); for(var i 0; i result.rows.length; i){ $(#result).append(b result.rows.item(i)[id]------ result.rows.item(i)[username] /bbr /); } }, function(){ alert(error); }); }); } /script /head body div idmy styleheight:100px;width:200px;border:1px solid red; input typetext nameusername idusername value/ br/ button onclickbtnClick()insert/button /div div idmy1 styleheight:300px;width:200px;border:1px solid red; button onclickbtnSelect()select/button div idresult styleheight:300px;width:200px;border:1px solid blue; /div /div /body /html 2.注意引入js文件哦
3.已经ok直接打开网页浏览 ,用谷歌浏览器然后 按 F12键 查看 Application --Web SQL 下面有新建的数据库以及表
