html5 本地存储有多少种方案

一、html5 本地存储有多少种方案

LocalStorage就是Key-Value的简单键值对存储结构，Web Storage除了localStorage的持久性存储外，还有针对本次回话的sessionStorage方式，一般情况下localStorage较为常用，示例代码如下：

var value= dataModel.serialize();

window.localStorage['DataModel']= value;

window.localStorage['DataCount']= dataModel.size();

console.log(dataModel.size()+' datas are saved');

var value= window.localStorage['DataModel'];

dataModel.deserialize(value);

console.log(window.localStorage['DataCount']+' datas are restored');

if(window.localStorage['DataModel']){

console.log(window.localStorage['DataCount']+' datas are cleared');

delete window.localStorage['DataModel'];

delete window.localStorage['DataCount'];

这种存储方式存储内容很有限，只适合做简单信息存储，存取接口设计得极其反人类，举例如下：

function getCookieValue(name){

if(document.cookie.length> 0){

var start= document.cookie.indexOf(name+"=");

start= start+ name.length+ 1;

var end= document.cookie.indexOf(";", start);

return unescape(document.cookie.substring(start, end));

var value= dataModel.serialize();

document.cookie='DataModel='+ escape(value);

document.cookie='DataCount='+ dataModel.size();

console.log(dataModel.size()+' datas are saved');

IndexedDB可以存储结构对象，可构建key和index的索引方式查找，目前各浏览器的已经逐渐支持IndexedDB的存储方式，其使用代码如下，需注意IndexedDB的很多操作接口类似NodeJS的异步回调方式，特别是查询时连cursor的continue都是异步再次回调onsuccess函数的操作方式，因此和NodeJS一样使用上不如同步的代码容易。

var tx= db.transaction("meters","readwrite");

var store= tx.objectStore("meters");

dataModel.each(function(data){

meterValue: data.a('meter.value'),

meterAngle: data.a('meter.angle'),

console.log(dataModel.size()+' datas are saved');

return dataModel.serialize();

FileSystem API相当于操作本地文件的存储方式，目前支持浏览器不多，其接口标准也在发展制定变化中，因此也可以动态生成图片到本地文件，然后通过 filesystem:http:***的URL方式直接赋值给img的html元素的src访问。

var value= dataModel.serialize();

fs.root.getFile('meters.txt',{create: true}, function(fileEntry){

console.log(fileEntry.toURL());

fileEntry.createWriter(function(fileWriter){

fileWriter.onwriteend= function(){

console.log(dataModel.size()+' datas are saved');

var blob= new Blob([value],{type:'text/plain'});

window.applicationCache对象是对浏览器的应用缓存的编程访问方式。其 status属性可用于查看缓存的当前状态：

var appCache= window.applicationCache;

case appCache.UNCACHED:// UNCACHED== 0

case appCache.IDLE:// IDLE== 1

case appCache.CHECKING:// CHECKING== 2

case appCache.DOWNLOADING:// DOWNLOADING== 3

case appCache.UPDATEREADY:// UPDATEREADY== 4

case appCache.OBSOLETE:// OBSOLETE== 5

return'UKNOWN CACHE STATUS';

二、js脚本是什么意思

js脚本是一种直译式脚本语言，是一种动态类型、弱类型、基于原型的语言，内置支持类型。它的解释器被称为JavaScript引擎，为浏览器的一部分，广泛用于客户端的脚本语言，最早是在HTML（标准通用标记语言下的一个应用）网页上使用，用来给HTML网页增加动态功能。

JavaScript是一种属于网络的脚本语言，已经被广泛用于Web应用开发，常用来为网页添加各式各样的动态功能，为用户提供更流畅美观的浏览效果。通常JavaScript脚本是通过嵌入在HTML中来实现自身的功能的。

1、是一种解释性脚本语言（代码不进行预编译）。

2、主要用来向HTML（标准通用标记语言下的一个应用）页面添加交互行为。

3、可以直接嵌入HTML页面，但写成单独的js文件有利于结构和行为的分离。

4、跨平台特性，在绝大多数浏览器的支持下，可以在多种平台下运行（如Windows、Linux、Mac、Android、iOS等）。

Javascript脚本语言同其他语言一样，有它自身的基本数据类型，表达式和算术运算符及程序的基本程序框架。Javascript提供了四种基本的数据类型和两种特殊数据类型用来处理数据和文字。而变量提供存放信息的地方，表达式则可以完成较复杂的信息处理。

1、使网页具有交互性，例如响应用户点击，给用户提供更好的体验。

2、可以处理表单，检验用户的输入，并提供及时反馈节省用户时间。例如，表单中要你输入电子邮箱而你却输入一个手机号，那么应该给你一个提醒。

3、还可以根据用户的操作，动态的创建页面。例如，发邮件时，添加附件操作。

4、设置cookie，cookie是存储在浏览器上的一些临时信息，例如你浏览过的网站地址，使用过的用户名。