在Html 5之前,由于没有localStorage,我们要实现记录密码或者自动登录的功能,基本只能依靠Cookie,而现在只能手机已经十分普遍,现在手机上浏览网页无法通过Cookie来实现类似功能,于是Html 5 给我们提供了一个非常好用的行特性localStorage。
localStorage的功能和Cookie差不多,主要用来记录一些script中需要使用的信息,它的构造和Map十分类似,提供了key/value的查找方式,所以使用起来非常方便。
localStorage最常用的API有三个,分别是setItem(key, value), getItem(key),remove(key)。通过这三个方法名字也能知道它们各自的作用。顺便给出一些我写的一个方法:
var saveKeyValue = function(key, value) {
if (typeof localStorage !== undefined) {
try {
localStorage.setItem(key, value);
} catch (e) {
if (e == QUOTA_EXCEEDED_ERR) {
alert('Quota exceeded');
}
}
}
};
var getValueByKey = function(key) {
var value = localStorage.getItem(key);
return value == null ? 'empty!' : value;
};
var removeKey = function(key) {
localStorage.removeItem(key);
};
saveKeyValue('name', 'Jobs');
alert(getValueByKey('name'));
removeKey('name');
alert(getValueByKey('name'));
上面的代码大家也可以到以下地址进行查看(最好使用chrome或者其他支持html5的浏览器)
http://jsfiddle.net/kiddYu619/YAAR8/
分享到:
相关推荐
这个压缩包文件包含了多个关于HTML5新特性的介绍,包括“浅谈HTML5_20080804.pps”、“Developing with HTML5.ppt”、“HTML5_Accessibility_faulkner.ppt”、“www.99pan.com_HTML5.ppt”以及“05-18-09-...
每个文件可能分别侧重不同的方面,比如第一个PPT可能主要介绍HTML5的新标签,第二个可能深入JS新API,而第三个则可能详细阐述CSS3的动画效果。通过这三个PPT的学习,开发者可以全面了解并掌握HTML5的最新特性,提升...
LocalStorage是HTML5引入的一种新的Web存储机制,它提供了比传统Cookie更大的存储空间(通常为5MB)。LocalStorage的设计目的是持久化存储,这意味着即使用户关闭浏览器或计算机,存储的数据也不会丢失。它以键值对...
`localStorage`是HTML5引入的一种本地存储机制,允许Web应用在用户的浏览器中存储大量数据,相比于传统的Cookie,`localStorage`提供了更大的存储空间(通常为5MB),并且数据不会随着HTTP请求发送,从而降低了网络...
在ES6中,我们可以使用模板字符串、箭头函数、let和const变量声明、类和模块等新特性,使代码更简洁、易读。例如,可以创建一个JavaScript对象表示学生,用数组存储所有学生对象,然后使用数组方法(如push、pop、...
localStorage是HTML5的一个重要特性,它允许在浏览器会话之间持久存储键值对数据。这对于实现应用的本地状态管理非常有用,例如保存用户的偏好设置或游戏进度。在Android中,通过WebView的JavaScript接口,开发者...
### 一、HTML5概述及新增特性 HTML5作为HTML标准的一个重要更新版本,自发布以来就备受关注。它不仅增强了网页的表现力,更重要的是,它引入了一系列的新特性,极大地提升了网页的应用能力和用户体验。 #### 1. ...
HTML5Gallery等网站展示了大量使用HTML5新特性的优秀案例,对于开发者来说,可以参考这些实例学习如何利用HTML5的新功能来提升网站的用户体验和功能性。HTML5教程则帮助开发者了解如何开始使用这些新特性,以创建...
通过深入理解这个组件的实现,开发者可以更好地利用HTML5的localStorage特性,提升Web应用的用户体验,同时降低后端服务器的压力。这个组件的源代码(localStorage-master)值得仔细研究和学习,以便在实际项目中...
在HTML5中,新加入了一个localStorage特性,这个特性主要是用来作为本地存储来使用的,解决了cookie存储空间不足的问题(cookie中每条cookie的存储空间为4k),localStorage中一般浏览器支持的是5M大小,这个在不同的...
在这个"html5canvas示例和api及新特性介绍"的资料中,你将找到关于Canvas API的详细说明以及HTML5的新特性介绍,非常适合初学者入门学习。 首先,HTML5 Canvas的基本用法是通过JavaScript来操作。在HTML文件中创建...
HTML5是现代网页开发的核心标准,它引入了许多新特性,其中一项重要的改进就是对本地存储的支持。本项目“基于html5的localstorage的本地存储数据库”着重探讨了如何利用HTML5的Local Storage特性来实现一个简单的...
【标题】:“期刊HTML5新特性安全研究综述_张玉清1” 【内容概要】:HTML5作为Web应用程序的最新标准,引入了许多新特性,增强了浏览器的功能,但同时也带来了一系列新的安全问题。HTML5的安全性对于保障Web应用的...
HTML5是Web应用程序的最新标准,它通过引入一系列新特性极大地丰富了浏览器的功能,但也带来了新的安全问题。本文由张玉清、贾岩、雷柯楠、吕少卿和乐洪舟共同撰写,主要探讨了HTML5新特性的安全性,并对相关研究...
HTML5的localStorage是Web开发中的一个重要特性,它允许开发者在用户浏览器上持久地存储数据,这些数据不受浏览器会话的影响,即使用户关闭了浏览器或重新启动电脑,数据仍然存在。这个功能极大地增强了Web应用程序...
通常,这类文章会介绍通过引入JavaScript库或工具来解决这个问题,比如“html5.js”这个文件名所示,可能是一个JavaScript库,用于向旧版IE添加对HTML5特性的兼容性。 标签 "源码" 和 "工具" 提示了解决方案可能...