localStorage对象存储的数据没有时间限制,比如:它可以存储到第二天,第三周,半年,或二三年,只要您的电脑没有重新安装系统或更换硬盘,数据仍然会被保留着。

实例:

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>localStorage</title>
<meta charset="utf-8" />
<style type="text/css"></style>
<script type="text/javascript">
if (typeof (Storage) !== "undefined") {
localStorage.englishName = "melao2006";
document.getElementById("pid").innerHTML = "lastName:" + localStorage.englishName;
}
else {
document.getElementById("pid").innerHTML = "Sorry!,您的浏览器不支持web存储";
}
</script>
</head>
<body>
<p id="pid"></p>
</body>
</html>

实例分析:

1、使用key="englishName"和value="melao2006"创建了一个localStorage键/值对形式来存储。

2、检查键为englishName的值插入到一个id="result"的元素中。

提示:键值对通常是以字符串的形式存储数据,您可以根据自己的数据要求转换格式。如:

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<meta charset="utf-8" />
<style type="text/css"></style>
<script type="text/javascript">
function myFunction() {
if (typeof (Storage) !== "undefined")
{
if (localStorage.clickCount) {
localStorage.clickCount = Number(localStorage.clickCount) + 1;//转换成自己需要的数据格式
}
else {
localStorage.clickCount = 1;
}
document.getElementById("result").innerHTML = localStorage.clickCount;
}
else {
document.getElementById("pid").innerHTML = "Sorry!,您的浏览器不支持web存储";
}
}

</script>
</head>
<body>
<input type="button" onclick="myFunction()" value="点击按钮" />
<p>点击按钮查看计数器的增加</p>
<p>关闭浏览器窗口再一次打开,继续点击按钮,计算器的数字仍然在增加。</p>
<p id="result"></p>
</body>
</html>

localStorage对象的更多相关文章

  1. localStorage对象简单应用 - - 访问次数

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. 使用sessionStorage、localStorage存储数组与对象

    先介绍一下localStorage localStorage对象是HTML5的客户端存储持久化数据的方案.为了能访问到同一个localStorage对象,页面必须来自同一个域名(子域名无效),使用同一 ...

  3. 使用clear来清除localStorage保存对象的全部数据

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

  4. HTML5 localStorage本地存储

    介绍 localStorage(本地存储)的使用方式.包括对存储对象的添加.修改.删除.事件触发等操作. 目录 1. 介绍 1.1 说明 1.2 特点 1.3 浏览器最小版本支持 1.4 适合场景 2 ...

  5. 初识html5的localStorage本地存储

    一.概述 HTML5 提供了两种在客户端存储数据的新方法: localStorage - 没有时间限制的数据存储 sessionStorage - 针对一个 session 的数据存储 之前,这些都是 ...

  6. HTML5本地存储Localstorage

    什么是localstorage 前几天在老项目中发现有对cookie的操作觉得很奇怪,咨询下来是要缓存一些信息,以避免在URL上面传递参数,但没有考虑过cookie会带来什么问题: ① cookie大 ...

  7. Cookie, LocalStorage 与 SessionStorage

    Cookie, LocalStorage 与 SessionStorage相同点 都是储存在用户本地的数据. 意义在于避免数据在浏览器和服务器间不必要地来回传递. 三者的特点     同属于html5 ...

  8. cookie、sessionStorage、localStorage

    转自--http://www.cnblogs.com/fly_dragon/p/3946012.html cookie Cookie的大小.格式.存储数据格式等限制,网站应用如果想在浏览器端存储用户的 ...

  9. localStorage、sessionStorage在无痕模式下被禁用

    在移动web开发中,经常会使用到localStorage去缓存一些数据,一般情况下,我们只需要按照下面的代码去使用就不会有 问题. if(window.localStorage){ localStor ...

随机推荐

  1. poj 3417 Network(tarjan lca)

    poj 3417 Network(tarjan lca) 先给出一棵无根树,然后下面再给出m条边,把这m条边连上,然后每次你能毁掉两条边,规定一条是树边,一条是新边,问有多少种方案能使树断裂. 我们设 ...

  2. 洛谷P3750 [六省联考2017]分手是祝愿(期望dp)

    传送门 嗯……概率期望这东西太神了…… 先考虑一下最佳方案,肯定是从大到小亮的就灭(这个仔细想一想应该就能发现) 那么直接一遍枚举就能$O(nlogn)$把这个东西给搞出来 然后考虑期望dp,设$f[ ...

  3. pgpool-ii 安装手册 基于Centos7.3

    http://www.bkjia.com/jQuery/1173582.html地址被占用pgpool启动失败 Nov 15 02:33:56 node3 pgpool: 2016-11-15 02: ...

  4. 出现提示ERROR 1289 The 'InnoDB' feature is disabled; you need MySQL built with 'InnoDB' to have IT working

    关闭mysql数据库 在mysql的安装目录中找到my.ini文件找到skip-innodb,在前面加上#号保存,重启mysql服务 OK.

  5. Codeforces Round #562 (Div. 2) C. Increasing by Modulo

    链接:https://codeforces.com/contest/1169/problem/C 题意: Toad Zitz has an array of integers, each intege ...

  6. 关系型数据库---MySQL---数据库设计三大范式

    1.第一范式: 1.1.1 数据表的每个数据列具有原子性: 1.1.2 同一个数据表中内容相似的数据列必须消除: 2.第二范式: 第一范式的基础上,每个数据表只描述一件事: 3.第三范式: 第二范式的 ...

  7. 关于小米手机USB传输稍大点的文件老中断的问题解决方法!

    关于小米手机USB传输稍大点的文件老中断的问题解决方法! 这是一个很痛苦的事情,当你传输大文件的时候,传输到一半就会莫名其妙的中断,拔插数据线很多次以后,好不容易没准可以成功传输一次. 后来使用了36 ...

  8. 《java学习三》jvm性能优化-------调优

    常见参数配置 -XX:+PrintGC      每次触发GC的时候打印相关日志 -XX:+UseSerialGC      串行回收 -XX:+PrintGCDetails  更详细的GC日志 -X ...

  9. 一条shell统计代码行数

    Xcode统计代码,用shell命令即可,非常简单.打开终端,进入你的工程目录,执行下列代码 find . -name "*.m" -or -name "*.h" ...

  10. LNK2005错误——重复定义错误

    编程中经常能遇到LNK2005错误——重复定义错误,其实LNK2005错误并不是一个很难解决的错误.弄清楚它形成的原因,就可以轻松解决它了. 造成LNK2005错误主要有以下几种情况: 1.重复定义全 ...