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伸缩布局盒模型Flex布局
Aug 20 HTML / CSS
CSS3+js实现简单的时钟特效
Mar 18 HTML / CSS
详解CSS3中@media的实际使用
Aug 04 HTML / CSS
CSS3让登陆面板3D旋转起来
May 03 HTML / CSS
CSS3 实现弹幕的示例代码
Aug 07 HTML / CSS
css3如何绘制一个圆圆的loading转圈动画
Jan 09 HTML / CSS
css3利用transform变形结合事件完成扇形导航
Oct 26 HTML / CSS
详解background属性的8个属性值(面试题)
Nov 02 HTML / CSS
详解canvas在圆弧周围绘制文本的两种写法
May 22 HTML / CSS
HTML5 Canvas之测试浏览器是否支持Canvas的方法
Jan 01 HTML / CSS
html5教你做炫酷的碎片式图片切换 (canvas)
Jul 28 HTML / CSS
通过feDisplacementMap和feImage实现水波特效
Apr 24 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+Mysql+jQuery实现发布微博程序 jQuery篇
2011/10/08 PHP
php中$美元符号与Zen Coding冲突问题解决方法分享
2014/05/28 PHP
9段PHP实用功能的代码推荐
2014/10/14 PHP
PHP+jquery实时显示网站在线人数的方法
2015/01/04 PHP
javascript html 静态页面传参数
2009/04/10 Javascript
Ext 表单布局实例代码
2009/04/30 Javascript
IE下JS读取xml文件示例代码
2013/08/05 Javascript
jquery下div 的resize事件示例代码
2014/03/09 Javascript
Jquery之Bind方法参数传递与接收的三种方法
2014/06/24 Javascript
javascript字符串函数汇总
2015/12/06 Javascript
jQuery基于函数重载实现自定义Alert函数样式的方法
2016/07/27 Javascript
js实现无缝滚动图
2017/02/22 Javascript
详解通过JSON数据使用VUE.JS
2017/05/26 Javascript
vue中v-cloak解决刷新或者加载出现闪烁问题(显示变量)
2018/04/20 Javascript
Angular4.x通过路由守卫进行路由重定向实现根据条件跳转到相应的页面(推荐)
2018/05/10 Javascript
如何用webpack4带你实现一个vue的打包的项目
2018/06/20 Javascript
jQuery实现上下滚动公告栏详细代码
2018/11/21 jQuery
微信小程序缓存过期时间的使用详情
2019/05/12 Javascript
webpack HappyPack实战详解
2019/10/08 Javascript
Python中的id()函数指的什么
2017/10/17 Python
Python对列表去重的多种方法(四种方法)
2017/12/05 Python
python实现图片文件批量重命名
2020/03/23 Python
Pycharm设置utf-8自动显示方法
2019/01/17 Python
基于Python的ModbusTCP客户端实现详解
2019/07/13 Python
python利用xpath爬取网上数据并存储到django模型中
2021/02/26 Python
全球领先的鞋类零售商:The Walking Company
2016/07/21 全球购物
德国最大的婴儿用品网上商店:Kidsroom.de(支持中文)
2020/09/02 全球购物
如何查看在weblogic中已经发布的EJB
2012/06/01 面试题
如何唤起类中的一个方法
2013/11/29 面试题
幸福家庭事迹材料
2014/02/03 职场文书
会务接待方案
2014/02/27 职场文书
环境科学专业教师求职信
2014/07/12 职场文书
学校食堂食品安全责任书
2014/07/28 职场文书
2015年前台个人工作总结
2015/04/03 职场文书
同学聚会祝酒词
2015/08/10 职场文书
学习新党章心得体会2016
2016/01/15 职场文书