使用本地存储和会话存储能够实现简单的对象持久化，能够对简单的键值对或对象进行存储。可是，对于比較复杂的关系数据进行处理时，就要用Web SQL Database.浏览器对Web SQL Database的支持情况如图：

一、怎样使用Web SQL Database

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

	<meta http-equiv="content-type" content="text/html;charset=utf-8">

	<title>Web SQL</title>

</head>

<body>

	<script type="text/javascript">

		//1、创建数据库连接

		try

		{

			var db = window.openDatabase('mydb','1.0','The First Web SQL Database','2*1024');

		}

		catch(err)

		{

			alert(err.message?err.message:err.toString());

		}

		//验证连接

		if(!db)

		{

			alert("不能连接数据库");

		}

		//2、运行SQL操作

		db.transaction(callback);

		//3、定义事务操作的回调函数

		function callback(tx)

		{

			//在事务中运行SQL操作

			var sql;

			//创建数据库表的结构

			sql = "create table emp(firstName text,lastName text,empType text,age integer)";

			tx.executeSql(sql);

			//插入数据库记录

			sql = "insert into emp(firstName,lastName,empType,age) values('kang','yua','my',20)";

			tx.executeSql(sql);

			sql = "insert into emp(firstName,lastName,empType,age) values(?,?,?,?)";

			tx.executeSql(sql,['kang','yuan','myEmp',30]);

			//查询数据记录

			sql = "select * from emp";

			tx.executeSql(sql,[],queryResult,queryError);

		}

		//SQL操作的回调函数

		function queryError(tx,err)

		{

			alert(err.message?err.message:err.toString());

		}

		function queryResult(tx,result)

		{

			try

			{

				//获取全部行

				var rowList = result.rows;

				//获取每行的记录

				for(var i = 0; i < rowList.length; i++)

				{

					var row = rowList.item(i);

					for(var j in row)

					{

						document.write(j+"="+row[j]+"<br/>");

					}

				}

			}

			catch(err)

			{

				alert(err.message?err.message:err.toString());

			}

		}

	</script>

</body>

</html>

在google中的结果和Web SQL中的数据：

二、异步数据库

使用window.openDatabase()方法创建本地数据库连接或者建立与已经存在的数据库之间的连接，称为异步运行数据库。由于它的操作并不是同步操作，而是须要非常多回调函数来接收异步运行的结果。

1、var db = window.openDatabase(name,version,displayName,estimatedSize[,creationCallback]):返回一个Database对象。

name:定义的数据库名，区分大写和小写且唯一。

version：创建的数据库的版本号，具有唯一性。

displayName：数据库的描写叙述信息，一般用于说明数据库的用途。

estimatedSize：数据库的估计大小，以byte为大小，能够更改。

creationCallback：可选，数据库没有被创建时运行的回调函数。

2、运行数据库事务：数据库创建成功返回Database对象，能够运行数据库操作。数据库的操作都是事务的。

2.1   db.transaction(callback[,errorCallback[,sucessCallback]]):运行事务的读写操作。

callBack:定义事务操作要运行的回调函数，该函数内运行的SQL操作都是事务的，要么所有成功或要么所有失败。该函数有一个SQLTransaction对象參数，该对象定义的方法运行SQL操作。

errorCallback：定义事务操作失败时调用的函数，该函数有一个SQLError对象的參数。

sucessCallback：定义事务操作成功时调用的函数，无參数。

2.2  db.readTransaction(callback[,errorCallback[,sucessCallback]]):运行事务的读操作，不能够进行写操作。參数同2.1.

3、数据库版本号管理

db.changeVersion(oldVersion,newVersion[,callback[,errorCallback[,sucessCallback]]]):用于改变数据库的版本号。兴许三个可选的參数同2.1。oldVersion是当前版本号号，一般设置为Database.version(该属性返回DB的版本号号)；newVersion：新版本号号，为字符串类型。

4、运行SQL语句：SQLTransaction对象定义了executeSql()方法运行SQL操作。

tx.executeSql(sql[,arg[,callback[,errorCallback]]]):

sql:运行的SQL语句

arg：可选，定义替换參数化查询中"?"占位符的数组，若没有使用參数化查询，參数能够忽略或者为空。

callback：定义一个SQL操作成功时运行的回调函数，若不定义，能够设置为null。该回调函数有两个參数：第一个是SQLTransaction对象，第二个是SQLResult对象，表示运行的结果。

errorCallback：定义一个SQL操作失败时运行的回调函数，若不定义，能够设置为null。该回调函数有两个參数：第一个是SQLTransaction对象，第二个是SQLError对象。

三、同步数据库

同步数据库操作仅用在worker内，不能用在网页中，可是在worker内能够使用异步数据库。眼下仅有Chrome 6支持同步数据库。

1、创建连接：在worker()内用WorkerGlobalScope.openDatabaseSync()方法创建本地数据库或者建立已经存在的数据库之间的连接。称为同步数据库，不须要各种回调函数来处理数据库操作结果。

var db = self.openDatabaseSync(name,version,displayName,estimatedSize[,creationCallback])：返回一个DatabaseSync对象，參数同openDatabase()方法。

2、运行数据库事务：db.transaction(callback)[运行读写操作]和db.readTransaction(callback)[运行写操作],callback函数的參数是一个SQLTransactionSync对象，该对象定义的方法运行SQL操作。

//事务操作的JS代码放在一个worker.js文件里

//在HTML中创建Worker并接收消息

if(window.Worker)

{

var worker = new Worker("worker.js");

....

}

else

{

alert("不支持Worker");

}

3、数据库版本号管理：

db.changeVersion(oldVersion,newVersion[,callback]):用于改变数据库的版本号。可选的參数同上。oldVersion是当前版本号号，一般设置为DatabaseSync.version(该属性返回DB的版本号号)；newVersion：新版本号号，为字符串类型。

4、运行SQL语句：SQLTransactionSync对象定义了executeSql()方法运行SQL操作。

var re=tx.executeSql(sql[,arg]):返回结果集

sql:运行的SQL语句

arg：可选，定义替换參数化查询中"?"占位符的数组。若没有使用參数化查询，參数能够忽略或者为空。

四、处理数据库操作的结果

成功使用executeSql()方法运行的SQL返回一个运行结果，该结果作为executeSql()的參数返回，是一个SQLResult对象。

interface SQLResult

{

readonly attribute long insertId; //返回记录行的ID

readonly attribute long rowsAffected; //返回SQL语句改变的行数

readonly sttribute SQLResultRowList rows;//返回全部记录行，没有记录则返回空对象

}

SQLResultRowList对象由SQLResultSetRowList接口定义

interface SQLResultSetRowList

{

readoonly attribute unsigned long length; //放回记录的行数

getter any item(in unsigned long index);//依据索引获取指定行，索引不存在返回null

}

五、SQL注入

使用參数化查询能够防止恶意SQL注入。參数化查询指定SQL语句中使用问号(?)作为參数占位符，为数据库訪问应用程序开发提供了一种安全、封装性的方法，将输入交给数据库进行预处理。

《Javascript权威指南》学习笔记之十八：BOM新成就（1）--client存储数据（Web SQL DataBase实现）的更多相关文章

  1. JavaScript 权威指南-学习笔记（一）

    本文所有教程及源码.软件仅为技术研究.不涉及计算机信息系统功能的删除.修改.增加.干扰,更不会影响计算机信息系统的正常运行.不得将代码用于非法用途,如侵立删! ## JavaScript 权威指南-学 ...

  2. JavaScript权威指南学习笔记6

    这两天主要翻看了书中的第18-22章,重点看了第17章:事件化处理,其它几章节主要是翻了下书知道有相关的概念,没有真正理解其中的内容,或者没有考虑究竟如何能把里面的内容应用到实际的项目中.说的讽刺一点 ...

  3. 《Javascript权威指南》学习笔记之十七：BOM新成就（1）--client存储数据（Storage实现）

    版权声明:本文为博主原创文章.未经博主同意不得转载. https://blog.csdn.net/u011043843/article/details/30255899     数据构成了web网站的 ...

  4. javascript权威指南学习笔记1

    打开这本书,进入到javascript的世界.以前都是看各种视频,感觉什么收获也没有,反而弄得脑袋混乱,希望能够按照这本书的节奏掌握javascript这门语言,为我的前端学习打下基础. 学习前准备: ...

  5. JavaScript权威指南学习笔记4

    今天看了第9.10.11章,感觉收获最大还是正则表达式那章节,不过这些不用太多脑子思考,问题用到了直接查书就可以了,下面分别总结一下: 第9章类和模块:分9节,前面8节都是在讲类相关的知识,最后一节讲 ...

  6. Javascript权威指南学习笔记

    第二章:词法结构 ;function a(){alert(2)};//前面的分号保证正确地语句解析 第三章:类型.值和变量 基本概念: 1.数据类型---能够表示并操作的值的类型叫做数据类型. 2.变 ...

  7. javascript权威指南学习笔记3

    今天看到第四章,记录一下其中的几个点,俗话说:好记性不如烂笔头嘛. 4.9   in运算符和instanceof运算符 in运算符希望它的左操作数是一个字符串或可以转化为字符串,希望它的右操作数是一个 ...

  8. javascript权威指南学习笔记2

    Javascript语言核心(2~12章) 第三章:类型.值.变量 1.数字: overflow(Infinity, -Infinity).underflow(+0,-0) 非数字值:它和任何值都不相 ...

  9. JavaScript权威指南学习笔记5

    下午在杭图回去前看了书中第二部分的13-17章,看的很粗,感觉大部分东西自己已经知道或者平时开发中不会用到,很多章节只是简单的翻了一下,没有仔细思考里面说到的道理,下面对各章节简单的记录下. 第13章 ...

  10. HTTP权威指南-学习笔记

    目录 HTTP权威指南-学习笔记 HTTP: Web的基础 URL与资源 HTTP报文 连接管理 HTTP结构 Web服务器 代理 缓存 集成点: 网关,隧道及中继 Web机器人 识别,认证与安全 客 ...

随机推荐

  1. AndroidUI的组成部分GridView

    java 代码例如以下(简单的知识点我会以凝视的形式解说): package com.gc.gridviewdemo; /** * @author Android将军 */ /** * 知识点解说: ...

  2. 区间第K大

    protected static int partitions(List<KDNode> data,int left,int right,int k,int pos){ int l = l ...

  3. Iphone CodeSign error: no provisioning profile at path 错

    今天在退房手续,变化了profile,当再次进行整理编译项目时.就出现了这个问题,在xCode 6 开发环境下出现了, 出现这个错误提示Code Sign error: Provisioning pr ...

  4. poj 1962 Corporative Network

    主题链接:http://poj.org/problem?id=1962 思路:每一个集合中用根节点标记这个集合,每一个点到根节点的距离. code: <span style="font ...

  5. hdu1325 Is It A Tree?并检查集合

    pid=1325">职务地址 试想一下,在词和话题hdu1272是一样的. 可是hdu1272的博文中我也说了.数据比較水,所以我用非并查集的方法就AC了. 可是这题的数据没那么水,要 ...

  6. CSA 第五届研讨会 想象

    参加第五届CSA云安全联盟研讨会. 人们太.所以,我们没有找到座位.立一个很长的时间.为了弥补没有时间坐在办公室.一个补回来.首先为大家介绍的信贷云,事实上独立: 信-使用-云 1. 信-使用-云 什 ...

  7. js运动动画

    原文:js运动动画 今天简单的学了一下js运动动画,再此感谢慕课网的这位老师http://www.imooc.com/view/167,讲的很不错. 下面是我整理出来的结果. 知识点一:速度动画. 1 ...

  8. 查看SQLServer 代理作业的历史信息

    原文:查看SQLServer 代理作业的历史信息 不敢说众所周知,但是大部分人都应该知道SQLServer的代理作业情况都存储在SQLServer5大系统数据库(master/msdb/model/t ...

  9. RH253读书笔记(1)-Lab 1 System Monitoring

    Lab 1 System Monitoring Goal: To build skills to better assess system resources, performance and sec ...

  10. 更改Calendar背景图(使用系统映像选择器)

    最近提出的申请,主接口是一个历,网上有很多第三方的日历控件,有使用ImageView实现,有使用GridView实现,它的优点是控制的灵活性. 而我选择使用本机CalendarView,关于这个控件, ...