HTML5BOM-客户端存储技术

1.web存储,是一种可以通过字符串形式的键值对来安全的存储和使用数据的方法。它可以同时在线和连线使用的网络程序。

2.web存储和另外一种 HTTP Cookie的区别

容量不同:web存储容量更大更安全 更易于使用,cookie至多存储4kB信息,web存储可以达到10MB

持久性不同:web存储是持久性的存储,Http Cookie不是永久性存储。

3. 存储类型:(这些都可以在浏览器的工具中来查询的)

客户端存储 有两种:本地存储(localStorage), 会话存储(sessionStorage)

4. localStorage

本地存储是没有时间限制的,根据浏览器设置来的。当浏览器关闭之后,数据还是存在的,这个是与sessionStorage的不同

使用方法: var oStorage=windown.localStorage;

  oStorage.book="<b>asdff</b>";

其中 windown.localStorage 是返回当前域对应的本地存储区域,其中可以存储对应的键值对,其中book就是键,“<b></b>”就是值。

获取键值的方法:

先检查键值是否存在,可以直接进行修改等

if(windown.localStorage.book)

{

}

else

windown.localStorage.book=" ffff";

5.sessionStorage

是针对session 进行数据存储,当浏览器关闭时,数据就会被删除。 

用法:windown.sessionStorage会返回一个在当前页面会话有效期内创建的会话存储区域。只要浏览器没有关闭,会话就会保存,可以通过恢复或者重新载入或者通过超链接打开都可以延长目前的会话。

6. 可以通过获取和更新存储

使用length,可以获得键值对的数量,可以使用key()根据索引好获取键名。

可以通过

oStorage.key(index);

oStorage.getItem(skey),获得键值

oStorage.length 获得长度

ostorage.clear()可以清除 localSotrage  和sessionSotrage 两个存储,不过只能在IE中用

可以清除指定的键值,oStorage.removeItem(sKey);

oStorage.setItem(key)可以添加新键和更新新键。

二、关系数据库(Web SQL Database)

由于客户端的本地存储和会话存储只能保存键值对的关系,而对于复杂的数据关系是没有办法处理的。

用关系数据库可以进行数据处理,并使用结构化查询语句SQL

1、使用web SQL Database 的方法

(1)建立连接

使用windown.openDatebase()方法打开

eg: var db=windown.openDateBase("mybase",'1.0',"描述",2*1024*1024)// 第一个参数时 数据库的名称,第二个参数时数据库的版本号,第三个参数时数据库描述,第四个参数时数据库的预估大小。

可以通过if(!db){}// 判断这个连接是否成功

(2)连接完后可以执行SQL语句

用db.transaction(function(tx){}) 方法可以执行SQL语句, 其中的函数是一个匿名函数。

里面有一个参数 function(tx){}, 也可以在外面定义,这个参数是用来定义要执行的SQL语句。function callback(tx){}  db.transaction(callback); 

 这个匿名函数具有一个事物类型的参数tx, tx是事物对象,具有tx.executeSql()方法,可以使用该方法执行SQL语句。

executeSql()方法有4个参数 ,第一个参数是SqL字符串,第二个参数时替换参数化查询中的?占位符, 第三个参数时执行成功是的回调函数 queryEesutl, 第四个时执行失败时的回调函数 queryError。

(3)通过对成功回调函数处理,可以对获得的结果进行处理。

当SQL执行后,会执行相应的回调函数。 当成功时 会执行一个回调函数,该函数有两个参数,一个是执行该函数的事物对象,一个是查询返回的结果。

function queryResult(tx,result)// tx 是事物对象, result 是SQLResult 对象,用户可以通过这个结果对象获取详细的信息

{

   var rowlist=result.rows;

  for(var i; i<rowlist.length;i++) // 遍历所有的行

  {

     var row=rowlist.item(i);

     for(var j in row)//输出一行中的所有的属性值

     {

         document.writeln(j+"  ="+ row[j])// 输出每个键对应的相对的值

     }

  } 

}

2.异步数据库

 是通过window.openDatabase()创建本地数据库或者连接已经存在的数据库,这种数据库是异步数据库,所谓的异步是指很多的操作并非同步执行 而是需要很多回调函数来接收异步执行的结果。 执行事务的操作: transaction();  执行语句操作  executeSql(string)

3. 同步数据库

是通过在Worker中存在的,是用WorkerGlobalScope.openDatabaseSync() 方法。 也可以用openDatabaseSync();  执行事务的操作: transaction();   readTransaction()  ;  执行语句操作  executeSql(string).

原文地址:https://www.cnblogs.com/xuruweb/p/4194500.html