HTML5本地数据库基础操作详解


Posted in HTML / CSS onApril 26, 2016

下面分别介绍本地数据库的各个API及其使用方法。

1、利用openDatabase创建数据库

我们可以利用openDatabase方法创建数据库。openDatabase方法传递五个参数,分别是:数据库名、数据库版本号(可省略)、对数据库的描述、设置分配的数据库的大小、回调函数。

如果我们要创建一个本地数据库,可以执行如下代码:

var myWebDatabase = openDatabase(“user”, ”1.0”, “user info”, 1024*1024, function(){}); 

这样就创建了一个用户信息表。之后可以对创建的本地数据库是否成功进行验证:

SQL Code复制内容到剪贴板
  1. if(!dataBase){     
  2. alert(“The database has been created successfully!”);     
  3. }else{     
  4. alert(“The database has not been successfully created.”)     
  5. }if(!dataBase){     
  6. alert(“The database has been created successfully!”);     
  7. }else{     
  8. alert(“The database has not been successfully created.”)     
  9. }     
  10.   

2、利用executeSql方法执行sql语句

使用executeSql方法,我们可以直接执行正常的sql语句,如下:

context.executeSql(‘INSERT INTO testTable(id,name) VALUES (1,”Martin”)’);

当然,这里只体现了executeSql的功能,并没有确切说明executeSql方法怎么用,用在哪里。要想使用该方法就必须介绍transaction。

3、利用transaction处理事务

该方法用来处理事务,可以传递三个参数:包含事务内容的一个方法、执行成功的回调函数、执行失败的回调函数(后两者可以省略)。

结合transaction和executeSql,我们就可在我们之前创建的数据库中添加创建数据表并添加数据了,代码如下:

JavaScript Code复制内容到剪贴板
  1. myWebDatabase.transaction(function (context) {     
  2.            context.executeSql('CREATE TABLE IF NOT EXISTS testTable (id unique, name)');     
  3.            context.executeSql('INSERT INTO testTable (id, name) VALUES (0, "Byron")');     
  4.            context.executeSql('INSERT INTO testTable (id, name) VALUES (1, "Casper")');     
  5.            context.executeSql('INSERT INTO testTable (id, name) VALUES (2, "Frank")');     
  6.          });     
  7.   

sql语句的含义不多解释,但从这里已经可以很明白的看出如何在本地数据库中,想在一般数据库中一样创建数据库数据表并添加数据了。

以上就是本文的全部内容,希望对大家的学习有所帮助。

本文链接:http://blog.csdn.net/fareise/article/details/50786594

HTML / CSS 相关文章推荐
CSS3动画之利用requestAnimationFrame触发重新播放功能
Sep 11 HTML / CSS
收集的22款给力的HTML5和CSS3帮助工具
Sep 14 HTML / CSS
CSS3简单实现照片墙
Dec 12 HTML / CSS
纯CSS3打造属于自己的“小黄人”
Mar 14 HTML / CSS
利用CSS3实现文字折纸效果实例代码
Jul 10 HTML / CSS
Html5页面在微信端的分享的实现方法
Aug 30 HTML / CSS
HTML5的结构和语义(5):内嵌媒体
Oct 17 HTML / CSS
html5图片上传预览示例分享
Apr 14 HTML / CSS
h5实现获取用户地理定位的实例代码
Jul 17 HTML / CSS
用canvas画心电图的示例代码
Sep 10 HTML / CSS
HTML中table表格拆分合并(colspan、rowspan)
Apr 07 HTML / CSS
css背景和边框标签实例详解
May 21 HTML / CSS
HTML5移动端手机网站开发流程
Apr 25 #HTML / CSS
基于html5绘制圆形多角图案
Apr 21 #HTML / CSS
浅析border-radius如何兼容IE
Apr 19 #HTML / CSS
如何利用input事件来监听移动端的输入
Apr 15 #HTML / CSS
HTML5移动端开发中的Viewport标签及相关CSS用法解析
Apr 15 #HTML / CSS
整理HTML5移动端开发的常用触摸事件
Apr 15 #HTML / CSS
实例讲解使用SVG制作loading加载动画的方法
Apr 05 #HTML / CSS
You might like
239军机修复记
2021/03/02 无线电
PHP的面试题集,附我的答案和分析(一)
2006/11/19 PHP
PHP 数组基础知识小结
2010/08/20 PHP
用PHP即时捕捉PHP中的错误并发送email通知的实现代码
2013/01/19 PHP
laravel 5 实现模板主题功能
2015/03/02 PHP
php实现异步将远程链接上内容(图片或内容)写到本地的方法
2016/11/30 PHP
javascript new 需不需要继续使用
2009/07/02 Javascript
checkbox全选/取消全选以及checkbox遍历jQuery实现代码
2009/12/02 Javascript
Jquery之美中不足小结
2011/02/16 Javascript
对frameset、frame、iframe的js操作示例代码
2013/08/16 Javascript
JavaScript实现点击自动选择TextArea文本的方法
2015/07/02 Javascript
动态加载jQuery的两种方法实例分析
2015/07/17 Javascript
JavaScript变量的作用域全解析
2015/08/14 Javascript
JS实现超简单的仿QQ折叠菜单效果
2015/09/21 Javascript
Canvas实现微信红包照片效果
2018/08/21 Javascript
如何从头实现一个node.js的koa框架
2019/06/17 Javascript
微信小程序实现日期格式化和倒计时
2020/11/01 Javascript
JS实现排行榜文字向上滚动轮播效果
2019/11/26 Javascript
JS实现canvas简单小画板功能
2020/06/23 Javascript
[04:28]2014DOTA2国际邀请赛 采访小兔子LGD挺进钥匙体育馆
2014/07/14 DOTA
[43:47]DOTA2上海特级锦标赛主赛事日 - 4 败者组第四轮#2 MVP.Phx VS Fnatic第一局
2016/03/05 DOTA
Python3实现从指定路径查找文件的方法
2015/05/22 Python
python matlibplot绘制多条曲线图
2021/02/19 Python
基于python实现从尾到头打印链表
2019/11/02 Python
python 基于opencv实现图像增强
2020/12/23 Python
HTML5中的autofocus(自动聚焦)属性介绍
2014/04/23 HTML / CSS
HTML5打开手机扫码功能及优缺点
2017/11/27 HTML / CSS
美国排名第一的在线葡萄酒商店:Wine.com
2016/09/07 全球购物
Schecker荷兰:狗狗用品和配件
2019/06/06 全球购物
德国购买踏板车网站:Microscooter
2019/10/14 全球购物
编码转换,怎样实现将GB2312编码的字符串转换为ISO-8859-1编码的字符串
2014/01/07 面试题
环境科学专业大学生自荐信格式
2013/09/21 职场文书
师范生实习自我鉴定
2013/11/01 职场文书
会计专业毕业自荐书范文
2014/02/08 职场文书
学校欢迎标语
2014/06/18 职场文书
比较node.js和Deno
2021/04/27 Javascript