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 calc()会计算属性详解
Feb 27 HTML / CSS
基于css3实现漂亮便签样式
Mar 18 HTML / CSS
css3 2D图片转动样式可以扩充到Js当中
Apr 29 HTML / CSS
非常漂亮的CSS3百叶窗焦点图动画
Feb 24 HTML / CSS
详解css3 Transition属性(平滑过渡菜单栏案例)
Sep 05 HTML / CSS
CSS3使用transition属性实现过渡效果
Apr 18 HTML / CSS
HTML5梦幻之旅——炫丽的流星雨效果实现过程
Aug 06 HTML / CSS
html5跨域通讯之postMessage的用法总结
Nov 07 HTML / CSS
微信小程序“圣诞帽”的实现思路详解
Dec 28 HTML / CSS
Html5导航栏吸顶方案原理与对比实现
Jun 10 HTML / CSS
html+css 实现简易导航栏功能
Apr 07 HTML / CSS
HTML速写之Emmet语法规则的实现
Apr 07 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
刚才在简化php的库,结果发现很多东西
2006/12/31 PHP
smarty学习笔记之常见代码段用法总结
2016/03/19 PHP
php使用curl通过代理获取数据的实现方法
2016/05/16 PHP
php结合ajax实现手机发红包的案例
2016/10/13 PHP
jquery实现多级下拉菜单的实例代码
2013/10/02 Javascript
Js参数值中含有单引号或双引号问题的解决方法
2013/11/06 Javascript
js动态添加表格数据使用insertRow和insertCell实现
2014/05/22 Javascript
Node.js与Sails ~项目结构与Mvc实现及日志机制
2015/10/14 Javascript
深入理解Node.js 事件循环和回调函数
2016/11/02 Javascript
Bootstrap面板学习使用
2017/02/09 Javascript
vue.js中mint-ui框架的使用方法
2017/05/12 Javascript
JavaScript仿微信(电话)联系人列表滑动字母索引实例讲解(推荐)
2017/08/16 Javascript
React组件内事件传参实现tab切换的示例代码
2018/07/04 Javascript
vue+element-ui+axios实现图片上传
2019/08/20 Javascript
node 解析图片二维码的内容代码实例
2019/09/11 Javascript
JS如何实现手机端输入验证码效果
2020/05/13 Javascript
Vue 组件复用多次自定义参数操作
2020/07/27 Javascript
[32:07]完美世界DOTA2联赛PWL S3 LBZS vs Rebirth 第一场 12.16
2020/12/17 DOTA
Python用zip函数同时遍历多个迭代器示例详解
2016/11/14 Python
Python实现的插入排序算法原理与用法实例分析
2017/11/22 Python
python使用tensorflow保存、加载和使用模型的方法
2018/01/31 Python
python3读取csv和xlsx文件的实例
2018/06/22 Python
对numpy中的数组条件筛选功能详解
2018/07/02 Python
在python中实现将一张图片剪切成四份的方法
2018/12/05 Python
Python3开发实例之非关系型图数据库Neo4j安装方法及Python3连接操作Neo4j方法实例
2020/03/18 Python
浅谈sklearn中predict与predict_proba区别
2020/06/28 Python
美国女性卫生用品公司:Thinx
2017/06/30 全球购物
乌克兰时尚鞋子和衣服购物网站:Born2be
2018/05/24 全球购物
eBay美国官网:eBay.com
2020/10/24 全球购物
大三自我鉴定范文
2013/10/05 职场文书
幼儿园毕业家长感言
2014/02/10 职场文书
2014国培学习感言
2014/03/05 职场文书
小学班干部竞选演讲稿
2014/04/24 职场文书
地球一小时宣传标语
2014/06/24 职场文书
党员自我剖析材料范文
2014/10/06 职场文书
2019年世界儿童日宣传标语
2019/11/22 职场文书