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 相关文章推荐
IE浏览器单独写CSS样式的几种方法
Oct 14 HTML / CSS
CSS3中的clip-path使用攻略
Aug 03 HTML / CSS
IE8下CSS3选择器nth-child() 不兼容问题的解决方法
Nov 16 HTML / CSS
css3 实现元素弧线运动的示例代码
Apr 24 HTML / CSS
html5理解head_动力节点Java学院整理
Jul 13 HTML / CSS
详解如何用canvas画一个微笑的表情
Mar 14 HTML / CSS
HTML5使用DOM进行自定义控制示例代码
Jun 08 HTML / CSS
HTML5 Canvas自定义圆角矩形与虚线示例代码
Aug 02 HTML / CSS
简单介绍HTML5中audio标签的使用
Sep 24 HTML / CSS
整理HTML5中表单的常用属性及新属性
Feb 19 HTML / CSS
HTML5本地存储之Web Storage详解
Jul 04 HTML / CSS
基于HTML5+tracking.js实现刷脸支付功能
Apr 16 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
PHILIPS AE3805收音机的分析打磨
2021/03/02 无线电
第十节--抽象方法和抽象类
2006/11/16 PHP
php下防止单引号,双引号在接受页面转义的设置方法
2008/09/25 PHP
PHP使用Mysqli类库实现完美分页效果的方法
2016/04/07 PHP
php数组函数array_push()、array_pop()及array_shift()简单用法示例
2020/01/26 PHP
摘自百度的图片轮换效果代码
2007/11/19 Javascript
调用js时ie6和ie7,ff的区别
2009/08/19 Javascript
网站页面自动跳转实现方法PHP、JSP(下)
2010/08/01 Javascript
input 和 textarea 输入框最大文字限制的jquery插件
2011/10/27 Javascript
jquery实现tr元素的上下移动示例代码
2013/12/20 Javascript
javascript实现简单的Map示例介绍
2013/12/23 Javascript
jquery 操作css样式、位置、尺寸方法汇总
2014/11/28 Javascript
基于AngularJS实现页面滚动到底自动加载数据的功能
2015/10/16 Javascript
jquery+json实现分页效果
2016/03/07 Javascript
AngularJS入门教程之表格实例详解
2016/07/27 Javascript
JS正则子匹配实例分析
2016/12/22 Javascript
JS+HTML5 FileReader对象用法示例
2017/04/07 Javascript
使用JavaScript实现点击循环切换图片效果
2017/09/03 Javascript
用node开发并发布一个cli工具的方法步骤
2019/01/03 Javascript
js实现滑动进度条效果
2020/08/21 Javascript
ES6的循环与可迭代对象示例详解
2021/01/31 Javascript
[02:37]2018DOTA2亚洲邀请赛赛前采访-EG篇
2018/04/03 DOTA
[01:31:02]TNC vs VG 2019国际邀请赛淘汰赛 胜者组赛BO3 第一场
2019/08/22 DOTA
Python爬取网页中的图片(搜狗图片)详解
2017/03/23 Python
Python实现的用户登录系统功能示例
2018/02/05 Python
allbeauty美国:英国在线美容店
2019/03/11 全球购物
请写一个C函数,若处理器是Big_endian的,则返回0;若是Little_endian的,则返回1
2015/07/16 面试题
综合测评自我鉴定
2013/10/08 职场文书
电大物流学生的自我评价
2013/10/25 职场文书
机关工会开展学习雷锋活动总结
2014/03/01 职场文书
工程资料员岗位职责
2014/03/10 职场文书
企业道德讲堂实施方案
2014/03/19 职场文书
慰问敬老院活动总结
2014/04/26 职场文书
会议新闻稿
2015/07/17 职场文书
幼师必备:幼儿园期末教师评语50条
2019/11/01 职场文书
win10电脑关机快捷键是哪个 win10快速关机的几种方法
2022/08/14 数码科技