每日记录 2016-4-29 HTML5本地存储
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本地存储的更多相关文章
- HTML5本地存储——IndexedDB二：索引
HTML5本地存储——IndexedDB(二:索引) 在HTML5本地存储——IndexedDB(一:基本使用)中介绍了关于IndexedDB的基本使用方法,很不过瘾,这篇我们来看看indexed ...
- HTML5本地存储——IndexedDB（一：基本使用）
在HTML5本地存储——Web SQL Database提到过Web SQL Database实际上已经被废弃,而HTML5的支持的本地存储实际上变成了 Web Storage(Local Stora ...
- HTML5本地存储——IndexedDB（二：索引）
在HTML5本地存储——IndexedDB(一:基本使用)中介绍了关于IndexedDB的基本使用方法,很不过瘾,这篇我们来看看indexedDB的杀器——索引. 熟悉数据库的同学都知道索引的一个好处 ...
- 利用HTML5开发Android(7)---HTML5本地存储之Database Storage
在上一篇<HTML5本地存储之Web Storage篇>中,简单介绍了如何利用localStorage实现本地存储:实际上,除了sessionStorage和localStorage外,H ...
- 利用HTML5开发Android(4)---HTML5本地存储之Web Storage
Web Storage是HTML5引入的一个非常重要的功能,可以在客户端本地存储数据,类似HTML4的cookie,但可实现功能要比cookie强大的多,cookie大小被限制在4KB,Web Sto ...
- HTML5本地存储之Web Storage应用介绍
Web Storage是HTML5引入的一个非常重要的功能,可以在客户端本地存储数据,类似HTML4的cookie,但可实现功能要比cookie强大的多,cookie大小被限制在4KB,Web Sto ...
- HTML5本地存储之本地数据库篇
<!DOCTYPE HTML> <html> <head> <meta charset="utf-8" /> <title&g ...
- HTML5本地存储之Web Storage实例篇,最有用的是localStorage
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- HTML5本地存储(Local Storage) 的前世今生
长久以来本地存储能力一直是桌面应用区别于Web应用的一个主要优势.对于桌面应用(或者原生应用),操作系统一般都提供了一个抽象层用来帮助应用程序保存其本地数据 例如(用户配置信息或者运行时状态等). 常 ...
随机推荐
- softmax_loss
softmax_loss中的ignore_label是来自于loss layer,而不是softmax_loss的参数
- CS 分解
将学习到什么 CS 分解是分划的酉矩阵在分划的酉等价之下的标准型. 它的证明涉及奇异值分解.QR 分解以及一个简单习题. 一个直观的习题 设 \(\Gamma, L \in M_p\). 假设 \ ...
- Linux 标准 I/O 库
为什么要设计标准 I/O 库? 直接使用 API 进行文件访问时,需要考虑许多细节问题,例如:read . write 时,缓冲区的大小该如何确定,才能使效率最优 read 和 write 等底层系统 ...
- synchronized 和ReentrantLock的区别
历史知识:JDK5之前,只有synchronized 可以用,之后就有了ReetrantLock可以用了 ReetrantLock (再入锁) 1.位于java.util.concurrnt.lock ...
- C++ lvalue，prvalue，xvalue，glvalue和rvalue详解（from cppreference）
General 每一个C++表达式(一个操作符和它的操作数,一个字面值,一个变量名等等)都代表着两个独立属性:类型+属性分类.在现代C++中 glvalue(泛左值) = lvalue (传统意义上的 ...
- Bootstrap历练实例：表单控件状态(禁用)
禁用的输入框 input 如果您想要禁用一个输入框 input,只需要简单地添加 disabled 属性,这不仅会禁用输入框,还会改变输入框的样式以及当鼠标的指针悬停在元素上时鼠标指针的样式. < ...
- iOS UIView中的坐标转换convertPoint --- iOS开发系列 ---项目中成长的知识六
如果你的UITableViewCell里面有一个Button需要响应事件,你会怎么做? 在Controller中使用 button父类的父类? 例如:UITableViewCell *parent ...
- MAC实现睡眠和休眠唤醒
因为苹果默认为休眠文件加密,Clover 是无法解密的.所以需要经过一些设置才能破除这无节操的加密文件sleepimage.在这之前不得不提下EmuVariableUefi-64.efi 这个驱动.我 ...
- CSS实现跳动的桃心
又来刷题--CSS动画实现跳动的桃心,从哪里跌倒就从哪里爬起来,哈哈哈~ 分析:首先,得画出一个桃心,然后再用动画效果让它跳起来(关于动画,实在是弱项啊~~~,得补补了). 第一步:画桃心,思路是一个 ...
- noip_最后一遍_2-图论部分
大体按照 数学 图论 dp 数据结构 这样的顺序 模板集 这个真的只有模板了……………… ·spfa #include<bits/stdc++.h> using namespace std ...