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基本操作的更多相关文章

  1. 本地存储localStorage以及它的封装接口store.js的使用

    本地存储localStorage以及它的封装接口store.js的使用 sublime-text chrome javascript readyGo 2016年11月20日发布   0 推荐 9 收藏 ...

  2. HTML5本地存储 localStorage操作使用详解

    1.html5几种存储形式 本地存储(localStorage && sessionStorage) 离线缓存(application cache) indexedDB 和 webSQ ...

  3. HTML5 本地存储 LocalStorage

    说到本地存储,这玩意真是历尽千辛万苦才走到HTML5这一步,之前的历史大概如下图所示: 最早的Cookies自然是大家都知道,问题主要就是太小,大概也就4KB的样子,而且IE6只支持每个域名20个co ...

  4. html5的本地存储localStorage和sessionStorage

    html5的本地存储localStorage和sessionStorage html5中新增的比较重要的一个功能就是web storage来实现客户端本地存储数据,之前存储数据都是用cookie来实现 ...

  5. HTML5新增的本地存储功能(笔记)

    HTML5新增的本地存储功能分为两种,分别对应两个JS对象:①本地存储对应localStorage对象,主要用于长期保存整个网站的数据(这些数据可以永久保存在客户端电脑硬盘内).②会话存储对应sess ...

  6. Cocos本地存储LocalStorage

    HTML5 LocalStorage 本地存储 //存档 var stopResumeMenu4 = cc.MenuItemFont.create("存档", this.onSav ...

  7. 本地存储localStorage sessionStorage 以及 session 和cookie的对比和使用

    cookie和session都是用来跟踪浏览器用户身份的会话方式. 1.验证当前服务中继续请求数据时,哪些缓存数据会随着发往服务器? 只有cookie中设置的缓存数据会发送到服务器端 2. 强调几点: ...

  8. 本地存储 localStorage

    本地存储localStorage 概念:window对象下面的属性,html5新增的,将5M大小的数据存储本地的浏览器上面. 浏览器支持存储5M大小 本地存储localStorage特点 本地存储属于 ...

  9. 移动端浏览器隐私模式/无痕模式使用本地存储localStorage/sessionStorage的问题

    移动端浏览器隐私模式/无痕模式使用本地存储localStorage/sessionStorage的问题 开发H5 webapp时经常需要使用本地存储,如localStorage和sessionStor ...

随机推荐

  1. ubuntu 14.04 nagios4+ndoutils2.0+centreon2.5.4配置

    ubuntu 14.04 nagios4+ndoutils2.0+centreon2.5.4(原创) 开发应用centreon是开源的IT监控软件,由法国人于2003年开发,最初名为Oreon,并于2 ...

  2. 在Windows 7下面IIS7的安装和 配置ASP的正确方法

    在Windows 7下如何安装IIS7,以及IIS7在安装过程中的一些需要注意的设置,以及在IIS7下配置ASP的正确方法. 一.进入Windows 7的 控制面板,选择左侧的打开或关闭Windows ...

  3. [转帖]译文：如何使用SocketAsyncEventArgs类（How to use the SocketAsyncEventArgs class）

    原文链接:http://norke.blog.163.com/blog/static/276572082011828104315941/ 引言 我一直在探寻一个高性能的Socket客户端代码.以前,我 ...

  4. Visual Studio 2015和.Net 2015 预览版在线安装和ISO镜像安装光盘下载

    微软刚刚宣布了 Visual Studio 2015和.Net 2015 预览版,并同时提供了下载. 微软在纽约正进行中的#Connect# 全球开发者在线大会上宣布了Visual Studio 20 ...

  5. Popup window

    function createLoadingDialog() { $("#loadingDialog").dialog({ autoOpen: false, closeOnEsca ...

  6. Unity学习笔记(2):注册映射

    在上一篇文章中(认识Unity)中概要介绍了Unity和Ioc,本节主要介绍IoC中的注册映射,并使用代码和配置文件两种方式进行说明. 定义依赖注入相关信息 定义ILogger接口 public in ...

  7. Opencv 的数据结构

    opencv的基本数据结构 结构 成员 意义 CvPoint int x,y 图像中的点 CvPoint2D32f float x,y 二维空间中的点 CvPoint3D32f float x,y,z ...

  8. IE10用video标签播放本地mp4文件失败的解决办法

    1. 首先用“格式工厂”将要播放的视频文件按照“AVC高质量与大小”转换为要求格式的mp4文件: 2. 设置IIS7.5,添加mp4的MIME类型,步骤如下: 1.打开IIS管理器(运行inetmgr ...

  9. sp_depends 查询在sybase中依赖的函数

    sp_depends 查询在sybase中依赖的函数. sp_depends tblEK7_policy_exclude sp_depends tblEK7_agent_exclude

  10. man手册使用

    1.是普通的命令 2.是系统调用,如open,write之类的(通过这个,至少可以很方便的查到调用这个函数,需要加什么头文件) 3.是库函数,如printf,fread 4.是特殊文件,也就是/dev ...