H5 数据存储localStorage
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<pre>
localStorage的使用：
1.存储的内容大概20mb
2.不同浏览器不能共享数据。但是在同一个浏览器的不同窗口中可以共享数据
3.永久生效，它的数据是存储在硬盘上，并不会随着页面或者浏览器的关闭而清除.如果想清除，必须手动清除 setItem(key,value):存储数据，以键值对的方式存储
getItem(key):获取数据，通过指定名称的key获取对应的value值
removeItem(key):删除数据，通过指定名称key删除对应的值
clear():清空所有存储的内容</pre>
<br>
<input type="text" id="userName"><br>
<input type="button" value="设置数据" id="setData">
<input type="button" value="获取数据" id="getData">
<input type="button" value="删除数据" id="removeData">
<input type="button" value="清空数据" id="emptyData">
<script>
document.querySelector("#setData").onclick=function(){
var name=document.querySelector("#userName").value;
/*使用localStorage存储数据*/
window.localStorage.setItem("userName",name);
}
/*获取数据*/
document.querySelector("#getData").onclick=function(){
var name=window.localStorage.getItem("userName");
alert(name);
}
/*清除数据*/
document.querySelector("#removeData").onclick=function(){
window.localStorage.removeItem("userName");
}
/* 清空数据 */
document.querySelector("#emptyData").onclick=function () {
window.localStorage.clear ();
}
</script>
</body>
</html>
H5 数据存储localStorage的更多相关文章
- 利用H5本地存储localStorage、sessionStorage
最近的业务处理上,要使用cookie缓存储一下数据,公司的cookie还搞出点问题.而用户的浏览器都是利用微信的内置,普遍支持h5的本地存储.于是利用了这个... 现代浏览器普遍开始支持H5本地存储, ...
- H5 - 本地数据存储 - localStorage.setItem
- angularjs 本地数据存储LocalStorage
1.定义服务 //=========本地存储数据服务============ app.factory('locals', ['$window', function ($window) { return ...
- Angular本地数据存储LocalStorage
//本地存储数据===================================.factory('locals',['$window',function($window){ return{ / ...
- angular.js 本地数据存储LocalStorage
定义工厂模式 factory 本地存储数据服务 app.factory('locals', ['$window', function ($window) { return { //存储单个属性 se ...
- H5本地存储详细使用教程（localStorage + JSON数据存储应用框架）
一.Web Storage教程 1.概述: 对于Web Storage来说,实际上是Cookies存储的进化版.如果了解Cookie的人几乎一看Web Storage就会用,如果你从来没用过没了解过C ...
- 客户端相关知识学习（十一）之Android H5交互Webview实现localStorage数据存储
前言 最近有一个需求是和在app中前端本地存储相关的,所以恶补了一下相关知识 webView开启支持H5 LocalStorage存储 有些时候我们发现写的本地存储没有起作用,那是因为默认WebVie ...
- 前端数据存储方案集合（cookie localStorage等）以及详解 （二）
前端数据存储方案集合(cookie localStorage等)以及详解 (二) 在之前的文章中已经介绍到了 前端存储方案中的 cookie . 但是 cookie 的存储上限是 4KB. 如果超过了 ...
- H5本地存储：sessionStorage和localStorage
作者:心叶时间:2018-05-01 18:30 H5提供了二种非常好用的本地存储方法:sessionStorage和localStorage,下面分别介绍一下: 1.sessionStorage:保 ...
随机推荐
- qt获取本机用户名
//获取用户名 QString getUserName() { #if 1 QStringList envVariables; envVariables << "USERNAME ...
- PHP-xdebug+PHPStorm的debug安装（未完）
PHP的xdebug安装 一.首先去phpinfo()查看自己的php是32还是64位的,再根据php版本在下面的网站https://xdebug.org/download.php选择xdebug插件 ...
- umount报错解决device is busy
umount –a 报错device is busy如图 df -h 执行 umount -l /dev/sdk1 fuser -m -v /cache10 再查看卸载了
- Java8中的LocalDateTime工具类
网上搜索了半天都没有找到Java8的LocalDateTime的工具类,只好自己写了一个,常用功能基本都有.还在用Date的Java同道该换换了. 个人项目地址:https://github.com/ ...
- Kubernetes Ingress日志分析入门
本文主要介绍如何基于日志服务构建Kubernetes Ingress日志分析平台,并提供一些简单的动手实验方便大家快速了解日志服务相关功能. 部署Ingress日志方案 登录容器服务管理控制台. 将上 ...
- SPARK-SQL内置函数之时间日期类
转载请注明转自:http://www.cnblogs.com/feiyumo/p/8760846.html 一.获取当前时间 1.current_date获取当前日期 2018-04-09 2.cur ...
- oracle Wrap加密
wrap就是一个加密的工具 参数: Iname 输入文件的名称 Oname输出文件的名称 如何加密Oracle中的存储过程,从而在schema下看不到其源码? 软件环境: 1.操作系统:Windows ...
- php一些易犯的错误
1.mysql数据库字段是区分大小写的.字段在数组中要小写.(数据库字段UE_account) 错误的:
- 转载 LibGDX: 使用 Gradle 命令运行和打包项目
版权声明:本文为csdn xietansheng 博主原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明. 本文链接: http://blog.csdn.net/xieta ...
- VS开发ArcEngine时的一个异常信息——“ArcGIS version not specified. You must call RuntimeManager.Bind before creating any ArcGIS components.”
问题描述:程序报错“ArcGIS version not specified. You must call RuntimeManager.Bind before creating any ArcGIS ...