HTML5 JS API 本地存储LocalStorage基本操作
LocalStorage：
使用方法与SessionStorage如出一辙，如下代码所示：
此对象主要有两个方法：
保存数据：localStorage.setItem(Key, value);
读取数据：localStorage.getItem(Key);
Key：表示你要存入的键名称，此名称可以随便命名，可以按照变量的意思来理解。
Value：表示值，也就是你要存入Key中的值，可以按照变量赋值来理解。
使用方法：
保存数据：localStorage.setItem("website", "W3Cfuns.com");
读取数据：localStorage.getItem("website");
案例如下：
<!DOCTYPE HTML>
<html>
<head>
<meta charset="gb2312">
<title>HTML5每日一练之JS API-本地存储LocalStorage | 前端开发网(W3Cfuns.com)！</title>
<script type="text/javascript">
window.onload = function()
{
alert("当你关闭此页面或者关闭浏览器的时候，localStorage中保存的数据才会消失，也就是说重新打开此页面的时候，点击获取数据，可以取到数据。") //首先获得body中的3个input元素
var msg = document.getElementById("msg");
var getData = document.getElementById("getData");
var setData = document.getElementById("setData"); setData.onclick = function()//存入数据
{
if(msg.value)
{
localStorage.setItem("data", msg.value);
alert("信息已保存到data字段中");
}
else
{
alert("信息不能为空");
}
} getData.onclick = function()//获取数据
{
var msg = localStorage.getItem("data");
if(msg)
{
alert("data字段中的值为：" + msg);
}
else
{
alert("data字段无值！");
}
}
}
</script>
</head> <body>
<input id="msg" type="text"/>
<input id="setData" type="button" value="保存数据"/>
<input id="getData" type="button" value="获取数据"/>
</body>
</html>
尊重每一名RD成果。。原文链接：http://www.w3cfuns.com/article-5592538-1-1.html
HTML5 JS API 本地存储LocalStorage基本操作的更多相关文章
- 本地存储localStorage以及它的封装接口store.js的使用
本地存储localStorage以及它的封装接口store.js的使用 sublime-text chrome javascript readyGo 2016年11月20日发布 0 推荐 9 收藏 ...
- HTML5本地存储 localStorage操作使用详解
1.html5几种存储形式 本地存储(localStorage && sessionStorage) 离线缓存(application cache) indexedDB 和 webSQ ...
- HTML5 本地存储 LocalStorage
说到本地存储,这玩意真是历尽千辛万苦才走到HTML5这一步,之前的历史大概如下图所示: 最早的Cookies自然是大家都知道,问题主要就是太小,大概也就4KB的样子,而且IE6只支持每个域名20个co ...
- html5的本地存储localStorage和sessionStorage
html5的本地存储localStorage和sessionStorage html5中新增的比较重要的一个功能就是web storage来实现客户端本地存储数据,之前存储数据都是用cookie来实现 ...
- HTML5新增的本地存储功能(笔记)
HTML5新增的本地存储功能分为两种,分别对应两个JS对象:①本地存储对应localStorage对象,主要用于长期保存整个网站的数据(这些数据可以永久保存在客户端电脑硬盘内).②会话存储对应sess ...
- Cocos本地存储LocalStorage
HTML5 LocalStorage 本地存储 //存档 var stopResumeMenu4 = cc.MenuItemFont.create("存档", this.onSav ...
- 本地存储localStorage sessionStorage 以及 session 和cookie的对比和使用
cookie和session都是用来跟踪浏览器用户身份的会话方式. 1.验证当前服务中继续请求数据时,哪些缓存数据会随着发往服务器? 只有cookie中设置的缓存数据会发送到服务器端 2. 强调几点: ...
- 本地存储 localStorage
本地存储localStorage 概念:window对象下面的属性,html5新增的,将5M大小的数据存储本地的浏览器上面. 浏览器支持存储5M大小 本地存储localStorage特点 本地存储属于 ...
- 移动端浏览器隐私模式/无痕模式使用本地存储localStorage/sessionStorage的问题
移动端浏览器隐私模式/无痕模式使用本地存储localStorage/sessionStorage的问题 开发H5 webapp时经常需要使用本地存储,如localStorage和sessionStor ...
随机推荐
- Servlet、Filter 生命周期
Servlet作为JavaEE必须掌握的内容,Struts2通过使用Filter的功能实现了一个MVC的框架.因此掌握这Servlet以及Filter的生命周期显得非常重要. 1. Servlet的生 ...
- border-radius导致overflow:hidden失效问题。
如果一个父元素设置了overflow:hidden属于的同时还设置了border-radius属性,那么如果想隐藏超出的子元素,四个圆角处会出现超出圆角依然显示的bug: 一种方法是运用-webkit ...
- 获取客户端访问的ip地址
function real_ip() { static $realip = NULL; if ($realip !== NULL) { return $realip; } if (isset($_SE ...
- MYSQL数据库主主同步实战
MYSQL支持单向.异步复制,复制过程中一个服务器充当主服务器,而一个或多个其它服务器充当从服务器.主服务器将更新写入二进制日志文件,并维护日志文件的一个索引以跟踪日志循环.当一个从服务器连接到主服务 ...
- php代码加密|PHP源码加密——实现方法
Encipher - PHP代码加密 | PHP源码加密下载地址:https://github.com/uniqid/encipher 该加密程序是用PHP代码写的,加密后代码无需任何附加扩展,无需安 ...
- mac上xampp配置
sudo su /Applications/XAMPP/xamppfiles/xampp security
- ORA-27102: out of memory并伴随OSD-00031的处理
刚才客户电话过来说有个数据库起不来了,开发商搞了好久搞不掂,得要让我们去帮忙看看.过去到现场,发现数据库无法打开,连nomount模式都不可以.报错的内容大致如下: ORA-27102: out of ...
- asp.net mvc Ajax.BeginForm不能异步刷新，或转到新页面，或页面还是刷新了，的原因(或解决办法)（转）
昨天搞了一下午的Ajax.BeginForm都没能实现异步刷新,一直将返回的数据提交到新的页面,在网上搜了n多方法都不行,问了n多人都没能搞定,今天大一早,就意外的被我发现了问题所在. 布局页: &l ...
- POJ 3701 概率DP
给定2^n 支足球队进行比赛,n<=7. 队伍两两之间有一个获胜的概率,求每一个队伍赢得最后比赛的概率是多少? 状态其实都是很显然的,一开始觉得这个问题很难啊,不会.dp[i][j] 表示第i支 ...
- js的基本概念详解
来自<javascript高级程序设计 第三版:作者Nicholas C. Zakas>的学习笔记(三) 如果你刚学js,想快速了解到js的基本概念,以下将会是一篇不错的引导文章: 语法 ...