客户端持久化解决方案: Web SQL

Web SQL 提供了一组使用 SQL 操作客户端数据库的 APIs, 不是 HTML5 规范的一部分,是一个独立的规范.

核心方法

  • openDatabase: 打开或新建数据库,返回数据库对象。
  • transaction: 打开一个事务,从而可以执行提交或者回滚。
  • executeSql: 执行实际的 SQL 查询。

打开/创建数据库

// window.openDatabase(dbName, version, description, dbSize, [createCallback]);
// 注: 数据库创建时才会触发回调
var db = openDatabase('mydb', '1.0', 'Test DB', 2*1024*1024, function() { console.log('db created..')});

创建数据库之后,就可以通过executeSql创建表,进而执行CRUD操作.

创建表

var db = openDatabase(dbName);
db.transaction(function(transaction) {////开启事务,在回调中执行sql
transaction.executeSql('CREATE TABLE IF NOT EXISTS user (id unique, name)');
});

插入数据

var db = openDatabase('mydb', '1.0', 'Test DB', 2 * 1024 * 1024);
db.transaction(function (tx) {
tx.executeSql('CREATE TABLE IF NOT EXISTS LOGS (id unique, log)');
tx.executeSql('INSERT INTO LOGS (id, log) VALUES (1, "菜鸟教程")');
tx.executeSql('INSERT INTO LOGS (id, log) VALUES (2, "www.runoob.com")');
});

读取数据

db.transaction(function (tx) {
tx.executeSql('SELECT * FROM LOGS', [], function (tx, results) {
var len = results.rows.length, i;
msg = "<p>查询记录条数: " + len + "</p>";
document.querySelector('#status').innerHTML += msg; for (i = 0; i < len; i++){
alert(results.rows.item(i).log );
} }, null);
});

客户端持久化解决方案: Web SQL的更多相关文章

  1. 客户端持久化解决方案:indexedDB

    客户端持久化解决方案:indexedDB indexedDB适合大量的结构化的数据存储:打开数据库和获取数据对象都是异步的: 需要开启事务,访问的objectStore都要是在开启的事务中. 数据库结 ...

  2. Web持久化存储Web SQL、Local Storage、Cookies(常用)

    在浏览器客户端记录一些信息,有三种常用的Web数据持久化存储的方式,分别是Web SQL.Local Storage.Cookies. Web SQL 作为html5本地数据库,可通过一套API来操纵 ...

  3. 客户端数据持久化解决方案: localStorage

    客户端数据持久化解决方案: localStorage localStorage主要用来替代cookie,解决cookie读写困难.容量有限的问题. localStorage有以下几个特点 localS ...

  4. HTML5客户端数据存储机制Web Storage和Web SQL Database

    引言 html5本地存储可以选择两种方式,一种是本地存储,一种是sqlite. 比如开发html5的购物车功能,就可以考虑选择其中之一,进行本地存储与操作. 又或者保存用户登录信息,可以使用local ...

  5. HTML5本地存储——Web SQL Database

    在HTML5 WebStorage介绍了html5本地存储的Local Storage和Session Storage,这两个是以键值对存储的解决方案,存储少量数据结构很有用,但是对于大量结构化数据就 ...

  6. HTML5 学习笔记(三)——本地存储(LocalStorage、SessionStorage、Web SQL Database)

    一.HTML4客户端存储 B/S架构的应用大量的信息存储在服务器端,客户端通过请求响应的方式从服务器获得数据,这样集中存储也会给服务器带来相应的压力,有些数据可以直接存储在客户端,传统的Web技术中会 ...

  7. [转]HTML5本地存储——Web SQL Database

    在HTML5 WebStorage介绍了html5本地存储的Local Storage和Session Storage,这两个是以键值对存储的解决方案,存储少量数据结构很有用,但是对于大量结构化数据就 ...

  8. HTML5本地存储——Web SQL Database与indexedDB

    虽然在HTML5 WebStorage介绍了html5本地存储的Local Storage和Session Storage,这两个是以键值对存储的解决方案,存储少量数据结构很有用,但是对于大量结构化数 ...

  9. 关于web浏览器的Web SQL和IndexedDB

    虽然在HTML5 WebStorage介绍了html5本地存储的Local Storage和Session Storage,这两个是以键值对存储的解决方案,存储少量数据结构很有用,但是对于大量结构化数 ...

随机推荐

  1. php 代码重用

    <?php /* 21.php * 代码重用 * include() required()载入文件 * include() 如果载入文件不存在,提示警告,还可以继续执行 * required() ...

  2. ASP.NET MVC5+ORACLE 身份认证

    菜鸟来的,刚接触mvc,看到mvc5上默认带有identity身份验证的东西,公司用的oracle数据库,便想着东西能不能支持oracle数据库,折腾了半天弄出下面的东西来,有些东西可能不太准确,望大 ...

  3. Android之用PopupWindow实现弹出listview形式菜单

    Android 4.0之前的菜单使用非常广泛,但是在android4.0之后,很少使用先前的菜单样式了.那如何实现下图的样式了? 我们简单模拟一下. (1)屏蔽系统弹出的菜单: 1.首先创建至少一个系 ...

  4. 快速配置 Samba 将 Linux 目录映射为 Windows 驱动器

    原文链接 samba client ubuntu redhat ubuntu gui tools 1,列出某个IP地址所提供的共享文件夹 smbclient -L 198.168.0.1   2,在s ...

  5. linux之SQL语句简明教程---SELECT

    SQL是用来做什么的呢?一个最常用的方式是将资料从数据库中的表格内选出.从这一句回答中,我们马上可以看到两个关键字: 从 (FROM) 数据库中的表格内 选出 (SELECT).(表格是一个数据库内的 ...

  6. uva 10382 Watering Grass_贪心

    题意:给你个矩形n*m,再给你n个圆的圆心坐标和半径,问最用最少用几个圆把这个矩形覆盖 思路:直接想发现这问题不容易,后来发现可以把圆看做区间(能把矩形面积覆盖),然后这个问题就容易解决了 #incl ...

  7. hdu 2222 Keywords_ac自动机模板

    题意:给你n个单词,再给你一串字符,求在字符中有多少个单词出现过 #include <iostream> #include<cstdio> #include<cstrin ...

  8. 胜利大逃亡(续)(状态压缩bfs)

    胜利大逃亡(续) Time Limit: 4000/2000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others) Total S ...

  9. iOS开发-使用Storyboard进行界面跳转及传值

    前言:苹果官方是推荐我们将所有的UI都使用Storyboard去搭建,Storyboard也是一个很成熟的工具了.使用Storyboard 去搭建所有界面,我们可以很迅捷地搭建出复杂的界面,也就是说能 ...

  10. 修改Chrome的User Agent的方法 真实有效

    如何修改Chrome的User Agent: 通过网络上查找,修改Chrome的Usre Agent有3种方式,但有的方式是不起作用的. 给Chrome添加启动参数(有作用) 通过扩展-User-Ag ...