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. ASP.NET MVC 3.0 参考源码索引

    http://www.projky.com/asp.netmvc/3.0/Microsoft/Internal/Web/Utils/CommonResources.cs.htmlhttp://www. ...

  2. php三种方法从控制结构或脚本中跳出

    PHP中,如果希望停止一段代码,根据需要达到的效果不同,可以有三种方法实现: 1. break: 如果在循环中使用了break语句,脚本就会从循环体后面的第一条语句开始执行: 2. continue: ...

  3. 【Python】python 2 map() reduce()

    利用map()函数,把用户输入的不规范的英文名字,变为首字母大写,其他小写的规范名字.输入:['adam', 'LISA', 'barT'],输出:['Adam', 'Lisa', 'Bart']. ...

  4. 适用于Rick的奖惩体系

    适用于Rick的奖惩体系 虽然对于时间有了更加清晰的认知,但是在时间管理方面还是不够严格,源于对自身的放松要求以及不够自律.第二个是周期性的思想松懈,比如周五了,想着马上周末了. 今天中午洗碗的时候, ...

  5. System Board Replacement Notice

    System Board Replacement Notice System Board Replacement Notice for TP 770E and TP 600 Restoring the ...

  6. c++11 线程的互斥量

    c++11 线程的互斥量 为什么需要互斥量 在多任务操作系统中,同时运行的多个任务可能都需要使用同一种资源.这个过程有点类似于,公司部门里,我在使用着打印机打印东西的同时(还没有打印完),别人刚好也在 ...

  7. MT【137】多少个?

    数列\(\{a_n\}\)共11项,\(a_1=0,a_{11}=4\),且\(|a_{k+1}-a_{k}|=2,k=1,2,\cdots,10\) 求满足条件的不同的数列的个数______ 解答: ...

  8. 【IOI 2018】Doll 机械娃娃

    我感觉这个题作为Day2T1,有一定的挑战性.为$Rxd$没有完成这道题可惜. 我觉得这道题,如果按照前几个部分分的思路来想,就有可能绕进错误的思路中.因为比如说每个传感器最多只在序列中出现$2$次, ...

  9. CF321E Ciel and Gondolas 【决策单调性dp】

    题目链接 CF321E 题解 题意:将\(n\)个人分成\(K\)段,每段的人两两之间产生代价,求最小代价和 容易设\(f[k][i]\)表示前\(i\)个人分成\(k\)段的最小代价和 设\(val ...

  10. npm publish gives “unscoped packages cannot be private”

    解决方法: npm publish --access public 详细参考此处