HTML5 Storage基础

最新推荐文章于 2024-09-09 13:10:14 发布

转载最新推荐文章于 2024-09-09 13:10:14 发布 · 514 阅读

文章标签：

#JS Web Stroage

HTML5 专栏收录该内容

9 篇文章

订阅专栏

本文介绍了如何使用HTML5的localStorage进行基本操作，包括检查浏览器支持情况、存储与检索数据、获取存储长度及删除数据等。通过示例代码展示了完整的使用流程。

1、判断设备是否支持

if(window.localStorage){
			document.write("localStorage" + "<br/>");
		}
		if(window.sessionStorage){
			document.write("sessionStorage" + "<br/>");
		}

2、接口源码

interface Storage {
			readonly attribute unsigned long length;
			DOMString? key(in unsigned long index);
			getter DOMString getItem(in DOMString key);
			setter creator void setItem(in DOMString key,in DOMString value);
			deleter void removeItem(in DOMString key);
			void clear();
		}

3、实际操作

if(window.localStorage){
			document.writeln("localStorage");
			localStorage.setItem("name","非一般的黑客");
			var namevalue = localStorage.getItem("name");
			document.writeln(namevalue);
			document.writeln(localStorage.key(1));  //输出"name"
			document.writeln(localStorage.length);   //3 有以前的数据
			//删除指定key为"name"的item
			localStorage.removeItem("name");
			document.writeln(localStorage.length);  //2
			//删除localStorage所有key/value键值对 items
			localStorage.clear();
			document.writeln(localStorage.length);   //0
		}

摘录自《HTML5移动开发指南》唐俊开