域内安全、永久保存。即客户端或浏览器中来自同一域名的所有页面都可访问localStorage数据且数据除了删除否则永久保存,但客户端或浏览器之间的数据相互独立。

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body> </body>
</html>
<script type="text/javascript"> localStorage.setItem("coffeeType", "mocha"); //存储
var data = localStorage.getItem("coffeeType"); //读取
console.log(data); localStorage.removeItem("coffeeType"); //删除
var data2 = localStorage.getItem("coffeeType"); //读取
console.log(data2); localStorage.clear(); //清空保存的所有数据 localStorage.setItem("haha", ""); //存储 </script>
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<button onclick="read();">读取</button>
</body>
</html>
<script type="text/javascript"> function read(){
var data = localStorage.getItem("haha"); //读取
alert(data);
} </script>

localStorage H5本地存储的更多相关文章

  1. H5本地存储详细使用教程(localStorage + JSON数据存储应用框架)

    一.Web Storage教程 1.概述: 对于Web Storage来说,实际上是Cookies存储的进化版.如果了解Cookie的人几乎一看Web Storage就会用,如果你从来没用过没了解过C ...

  2. 利用H5本地存储localStorage、sessionStorage

    最近的业务处理上,要使用cookie缓存储一下数据,公司的cookie还搞出点问题.而用户的浏览器都是利用微信的内置,普遍支持h5的本地存储.于是利用了这个... 现代浏览器普遍开始支持H5本地存储, ...

  3. H5 本地存储一

    localStorage(本地存储),可以长期存储数据,没有时间限制,一天,一年,两年甚至更长,数据都可以使用.sessionStorage(会话存储),只有在浏览器被关闭之前使用,创建另一个页面时同 ...

  4. H5本地存储一

    localStorage(本地存储),可以长期存储数据,没有时间限制,一天,一年,两年甚至更长,数据都可以使用.sessionStorage(会话存储),只有在浏览器被关闭之前使用,创建另一个页面时同 ...

  5. h5 本地存储

    H5本地存储有两个API,一个是Web Storage,还有一个是Web SQL.不管是哪一个,都是基于JavaScript语言来使用,接下来我就教你怎么使用H5本地存储,本文篇幅较大,JS代码较多, ...

  6. H5本地存储(转)

    H5本地存储  一.本地存储由来的背景         众所周知Html4时代Cookie的大小.格式.存储数据格式等限制,网站应用如果想在浏览器端存储用户的部分信息,那么只能借助于Cookie.但是 ...

  7. H5本地存储详解

    H5之前存储数据一般是通过 cookie ,但是 cookie 存的数据容量比较少.H5 中扩充了文件存储能力,可存储多达 5MB 的数据.现在就实际开发经验来对本地存储 ( Storage ) 的使 ...

  8. H5本地存储:sessionStorage和localStorage

    作者:心叶时间:2018-05-01 18:30 H5提供了二种非常好用的本地存储方法:sessionStorage和localStorage,下面分别介绍一下: 1.sessionStorage:保 ...

  9. H5本地存储sessionStorage和localStorage的区别

    sessionStorage用于本地存储一个会话(session)中的数据,这些数据只有在同一个会话中的页面才能访问并且当会话结束后数据也随之销毁.因此sessionStorage不是一种持久化的本地 ...

随机推荐

  1. php框架中常用的设计模式

    1.单例模式 //单例模式 class Demo { private static $obj; private function __construct() { } private function ...

  2. ubuntu 手动apache记录

    1.下载apache tar -xvzf  httpd.xx 解压 2.下载安装pcre Download PCRE from PCRE.org 解压,进入文件夹中 ./configure --pre ...

  3. elasticsearch6 学习之批量操作

    环境:elasticsearch6.1.2        kibana6.1.2  一.mget批量查询 mget可以将多个请求才能获的数据,合并到一个请求中以节省网络开销. 1.查询同一个索引下,通 ...

  4. 【bzoj5197】[CERC2017]Gambling Guide 期望dp+堆优化Dijkstra

    题目描述 给定一张n个点,m条双向边的无向图. 你要从1号点走到n号点.当你位于x点时,你需要花1元钱,等概率随机地买到与x相邻的一个点的票,只有通过票才能走到其它点. 每当完成一次交易时,你可以选择 ...

  5. shell脚本学习—正则表达式

    正则表达式概念.特点 正则表达式是对字符串操作的一种逻辑公式,就是用事先定义好的一些特定字符.及这些特定字符的组合,组成一个“规则字符串”, 这个“规则字符串”用来表达对字符串的一种过滤辑. 给定一个 ...

  6. php获取字符串的编码格式的方法(函数)

    // 检测字符的编码格式 $encode = mb_detect_encoding($string, array('ASCII','UTF-8','GB2312','GBK','BIG5')); ec ...

  7. Proving Equivalences UVALive - 4287(强连通分量 水题)

    就是统计入度为0 的点 和 出度为0 的点  输出 大的那一个,, 若图中只有一个强连通分量 则输出0即可 和https://www.cnblogs.com/WTSRUVF/p/9301096.htm ...

  8. pbuilder编译构建工具分析

    1. 简介 pbuilder(personal Debian package builder)是ubuntu环境下维护debian包的专业工具,能够为每个deb包创建纯净的编译构建环境,自动解析和安装 ...

  9. [洛谷P1642]规划

    题目大意:有一棵$n(n\leqslant100)$个点的树,每个点有两个权值$a,b$,要求选择一个$m$个点的连通块$S$,最大化$\dfrac{\sum\limits_{i\in S}a_i}{ ...

  10. Java操作excel(POI)

    由于在项目中使用了将excel数据导入到数据库.在这里分享一下. 这里使用的POI方式,支持两种格式(xls,xlsx) package com.entity; import java.io.File ...