HTML5新增的本地存储功能分为两种,分别对应两个JS对象:①本地存储对应localStorage对象,主要用于长期保存整个网站的数据(这些数据可以永久保存在客户端电脑硬盘内)。②会话存储对应sessionStorage对象,用于临时保存一个窗口的数据(在这个窗口关闭之前,数据是存在的,关闭窗口之后会被浏览器删除)。无论本地存储还是会话存储,都是与网站所在的域联系在一起的(也就是说,在同一个域名内,数据是可以互相访问的)。由于这些数据是保存在用户的计算机上,网页不能访问保存在其他用户计算机上的数据,类似的,如果你用不同的用户名登陆自己的计算机或者使用不用的浏览器,那么存取的也将是不同的本地存储数据。浏览器对web存储的支持是比较好的,最低版本有:IE8、chrome5、safari4、opera10.5、safari ios2以及android2

操作本地存储和会话存储:

    //保存一段信息到本地存储或会话存储中
localStorage[keyName] = data;
sessionStorage[keyName] = data;
//如果要检测某个属性值是否为空,可以直接测试它是否等于null
if (localStorage['name'] == null){alert('没有保存name这个属性')}

删除存储数据:只要调用removeItem()方法,存入要删除的属性名就可以删除不想要的数据了,也可以调用clear()方法,清空网站的存储数据(本地存储和会话存储都适用):

//删除某个存储数据
localStorage.removeItem('user_name'); //删除所有存储数据
localStorage.clear();

查找所有数据:适用key()方法可以从本地或会话存储中取得当前网站保存的所有数据

数据类型:通过localStorage或sessionStorage对象保存起来的数据,都会自动转换为字符串。如果要调用这两个对象里面的值是数字,则需要先把字符串转换为数字才能用。如果是对象,则可以通过JSON.parse()方法转换为对象在调用。

HTML5新增的本地存储功能(笔记)的更多相关文章

  1. HTML5开发学习:本地存储Web Sql Database

       Web Sql Database,中文翻译作"本地数据库",是随着HTML5规范加入的在浏览器端运行的轻量级数据库.    在HTML5中,大大丰富了客户端本地可以存储的内容 ...

  2. HTML5教程之本地存储SessionStorage

    SessionStorage: 将数据保存在session对象中,所谓session是指用户在浏览某个网站时,从进入网站到浏览器关闭所经过的这段时间会话,也就是用户浏览这个网站所花费的时间就是sess ...

  3. HTML5 使用localstorage 本地存储

    HTML 本地存储介绍 最早的 Cookies 自然是大家都知道,问题主要就是太小,大概也就 4KB 的样子,而且 IE6 只支持每个域名20个cookies,太少了.优势就是大家都支持,而且支持得还 ...

  4. HTML5规范的本地存储

    在HTML5 中定义了两种本地存储的,Web Storage 和本地数据库 SQL Database . 用来检查判断浏览器是否支持 Web Storage if(window.localStorag ...

  5. HTML5学习总结——本地存储

    一.HTML4客户端存储 B/S架构的应用大量的信息存储在服务器端,客户端通过请求响应的方式从服务器获得数据,这样集中存储也会给服务器带来相应的压力,有些数据可以直接存储在客户端,传统的Web技术中会 ...

  6. 初识html5的localStorage本地存储

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

  7. h5新增属性本地存储

    ---恢复内容开始--- 存储的两种类型: localStorage 和 sessionStorage localstorage:没有时间限制的数据存储 sessionStorage  针对一个ses ...

  8. HTML5的本地存储功能,值得研究

    https://developer.chrome.com/apps/offline_storage 搜索“chrome html5 本地缓存”,一大堆文章,比如: http://www.cnblogs ...

  9. Html5中的本地存储

    Web Storage web storage页面存储是html5为数据存储在客户端提供的一项重要功能,由于web storage API能够区分会话数据与长期数据.因此,相应API也分为两种: se ...

随机推荐

  1. fx投影效果分离

    虽然忙着花花二期三期bug.bug  ing,修改等待中突然看见一张logo.文字下面的阴影图,如下,就满脑子在想阴影到底咋做的.. 七拼八凑的尝试后大体样子是有,终究没有上图那种字体轮廓的阴影... ...

  2. Python入门:类与类的继承

    类,是一些有共同特征和行为事物的抽象概念的总和. 1. 定义一个类: 我们使用class来定义一个类,和之前说过的定义函数用def类似.在类里面给变量赋值时,专业术语称之为类的属性. 比如拿可口可乐来 ...

  3. linux 搭建epel本地库,并定时同步

    1.安装rsyncyum -y install rsync.x86_64 2.同步epel至本地#http://mirrors.ustc.edu.cn/status/ 获取镜像库rsync路径mkdi ...

  4. Android如何避免OOM总结

    转自:https://blog.csdn.net/ljx19900116/article/details/50037627 前面介绍了一些基础的内存管理机制以及OOM的基础知识,那么在实践操作当中,有 ...

  5. topcoder srm 738 div1 FindThePerfectTriangle(枚举)

    Problem Statement      You are given the ints perimeter and area. Your task is to find a triangle wi ...

  6. ajax请求提交到controller后总是不成功

    最近在做实习时,点击查询时在js中发送ajax请求到controller后台,但是无论怎么样都不成功,请求地址是正确的,因为在后台用system.out.println输出有值,并且也确实return ...

  7. 洛谷 P4091 [HEOI2016/TJOI2016]求和 解题报告

    P4091 [HEOI2016/TJOI2016]求和 题目描述 在2016年,佳媛姐姐刚刚学习了第二类斯特林数,非常开心. 现在他想计算这样一个函数的值: \[ f(n)=\sum_{i=0}^n\ ...

  8. ActiveMQ反序列化漏洞(CVE-2015-5254)复现

      0x00 漏洞前言 Apache ActiveMQ是美国阿帕奇(Apache)软件基金会所研发的一套开源的消息中间件,它支持Java消息服务,集群,Spring Framework等.Apache ...

  9. php版本的code review软件

    phabricator, http://www.oschina.net/p/phabricator

  10. LGP5075【JSOI2012】分零食

    . 题解: 令$F$为欢乐度$f(x) = Ox^2 + Sx + U$的生成函数,常数项为$0$: 令$G(x) = \sum_{i=0}^{A} F^i (x) $ $ans = [x^M]G;$ ...