HTML5本地存储

一、HTML5 localStorage

在HTML5中,本地存储是一个window的属性,包括localStorage和 sessionStorage,从名字应该可以很清楚的辨认二者的区别,前者是一直存在本地的,后者只是伴随着session,窗口一旦关闭就没了。二者用法完全相同。

之前,这些都是由 cookie 完成的。但是 cookie 不适合大量数据的存储,因为它们由每个对服务器的请求来传递,这使得 cookie 速度很慢而且效率也不高。

在 HTML5 中,数据不是由每个服务器请求传递的,而是只有在请求时使用数据。它使在不影响网站性能的情况下存储大量数据成为可能。

对于不同的网站,数据存储于不同的区域,并且一个网站只能访问其自身的数据。

HTML5 使用 JavaScript 来存储和访问数据。

localStorage 方法存储的数据没有时间限制。第二天、第二周或下一年之后,数据依然可用。localStorage有三种设置和访问本地存储的方法。

 

localStorage.t1 ="大碗干拌";

localStorage["t2"]="HTML5";

localStorage.setItem("t3","http://blog.csdn.net/dawanganban");

localStorage.t1;

localStorage["t2"];

localStorage.getItem("t3");

<!DOCTYPE HTML>
<html>
<head>
<meta charset="urf-8"/>
</head>
<body>
<script type="text/javascript">
//判断浏览器是否支持本地存储 if(window.localStorage){
localStorage.t1="大碗干拌";
document.write(localStorage.t1); localStorage['t2']="<br/>hello word"
document.write(localStorage.t2); localStorage.setItem("t3", "<br/>http://blog.csdn.net/dawanganban");
document.write(localStorage.t3);
}else{
alert("你的浏览器不支持");
} </script>
</body>
</html>

将上面三行赋值的代码注释掉,会发现数据依然能显示到浏览器上。

localStorage处理上面的赋值取值外还有下面几个用法:

localStorage.removeItem();   //清除

localStorage.clear()   //清除所有

localStorage.length   //获得多少键

localStorage.key()  //获得存储的键内容

<!DOCTYPE HTML>
<html>
<head>
<meta charset="urf-8"/>
</head>
<body>
<script type="text/javascript">
//判断浏览器是否支持本地存储 if(window.localStorage){
//先清除一下
localStorage.clear(); localStorage.t1="大碗干拌";
document.write(localStorage.t1); localStorage['t2']="<br/>hello word"
document.write(localStorage.t2); localStorage.setItem("t3", "<br/>http://blog.csdn.net/dawanganban");
document.write(localStorage.t3); //清除t2 全部清除用clear
localStorage.removeItem("t2"); for(var i=0;i<localStorage.length;i++){
document.write("<br/>" + localStorage.key(i) + "___"+localStorage.getItem(localStorage.key(i)));
} }else{
alert("你的浏览器不支持");
}
</script>
</body>
</html>

每日记录 2016-4-29 HTML5本地存储的更多相关文章

  1. HTML5本地存储——IndexedDB二:索引

    HTML5本地存储——IndexedDB(二:索引)   在HTML5本地存储——IndexedDB(一:基本使用)中介绍了关于IndexedDB的基本使用方法,很不过瘾,这篇我们来看看indexed ...

  2. HTML5本地存储——IndexedDB(一:基本使用)

    在HTML5本地存储——Web SQL Database提到过Web SQL Database实际上已经被废弃,而HTML5的支持的本地存储实际上变成了 Web Storage(Local Stora ...

  3. HTML5本地存储——IndexedDB(二:索引)

    在HTML5本地存储——IndexedDB(一:基本使用)中介绍了关于IndexedDB的基本使用方法,很不过瘾,这篇我们来看看indexedDB的杀器——索引. 熟悉数据库的同学都知道索引的一个好处 ...

  4. 利用HTML5开发Android(7)---HTML5本地存储之Database Storage

    在上一篇<HTML5本地存储之Web Storage篇>中,简单介绍了如何利用localStorage实现本地存储:实际上,除了sessionStorage和localStorage外,H ...

  5. 利用HTML5开发Android(4)---HTML5本地存储之Web Storage

    Web Storage是HTML5引入的一个非常重要的功能,可以在客户端本地存储数据,类似HTML4的cookie,但可实现功能要比cookie强大的多,cookie大小被限制在4KB,Web Sto ...

  6. HTML5本地存储之Web Storage应用介绍

    Web Storage是HTML5引入的一个非常重要的功能,可以在客户端本地存储数据,类似HTML4的cookie,但可实现功能要比cookie强大的多,cookie大小被限制在4KB,Web Sto ...

  7. HTML5本地存储之本地数据库篇

    <!DOCTYPE HTML> <html> <head> <meta charset="utf-8" /> <title&g ...

  8. HTML5本地存储之Web Storage实例篇,最有用的是localStorage

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  9. HTML5本地存储(Local Storage) 的前世今生

    长久以来本地存储能力一直是桌面应用区别于Web应用的一个主要优势.对于桌面应用(或者原生应用),操作系统一般都提供了一个抽象层用来帮助应用程序保存其本地数据 例如(用户配置信息或者运行时状态等). 常 ...

随机推荐

  1. 数据库-SQL语法:GROUP BY与HAVING

    注意:select 后的字段,必须要么包含在group by中,要么包含在having 后的聚合函数里. 1. GROUP BY 是分组查询, 一般 GROUP BY 是和聚合函数配合使用. grou ...

  2. pytorch中的view

    https://ptorch.com/news/59.html view()相当于reshape(),其中参数若为-1表示当前的size根据其余size推断

  3. sscanf的使用

    sscanf的使用 语法 int ssanf(const char *buffer, const char *format,[argument]...); 参数 buffer 存储的数据 format ...

  4. PAT 乙级 1037

    题目 题目地址:PAT 乙级 1037 题解 本题有两个版本的代码,初版因为种种问题写得比较繁琐,具体的分析见后文,更新的之后的版本相对来说要好很多,代码也比较清晰简洁. 初版的代码主要有如下几方面的 ...

  5. 元组-tuple

    Python内置的元组数据类型:tuple tuple和list非常类似,但tuple一旦初始化就不能修改,因此它没有append(),insert()这样的方法 当定义一个tuple时,tuple的 ...

  6. PAT Basic 1052

    1052 卖个萌 萌萌哒表情符号通常由“手”.“眼”.“口”三个主要部分组成.简单起见,我们假设一个表情符号是按下列格式输出的: [左手]([左眼][口][右眼])[右手] 现给出可选用的符号集合,请 ...

  7. apk 解包 打包

    APK应用程序的解包.修改.编辑.汉化.打包及应用 前两讲主要讲玩机的最基本的知识,集中在如何刷机.本讲是进级的内容,来谈谈与apk应用程序有关的知识,内容包括akp文件的解包.打包.反编辑.解析.汉 ...

  8. linux 第五部分 系统管理员 网络设定与备份

    linux 第五部分 系统管理员   网络设定与备份 系统基本设置   1.网络的设置  手动设置与dhcp自动获得     以及更改主机名称 centos 7   对网卡编号的规则 enol1  b ...

  9. Leetcode 394.字符串编码

    字符串编码 给定一个经过编码的字符串,返回它解码后的字符串. 编码规则为: k[encoded_string],表示其中方括号内部的 encoded_string 正好重复 k 次.注意 k 保证为正 ...

  10. Leetcode 337.大家结舍III

    打家劫舍III 在上次打劫完一条街道之后和一圈房屋后,小偷又发现了一个新的可行窃的地区.这个地区只有一个入口,我们称之为"根".除了"根"之外,每栋房子有且只有 ...