HTML5的localStorage缓存详解
导读：本文共1575.5字符，通常情况下阅读需要5分钟。同时您也可以点击右侧朗读，来听本文内容。按键盘←（左） →（右） 方向键可以翻页。
摘要： 什么是localStorageHTML5加入了localStorage，作为客户本地存储文件，之前用cookie，但是每条cookie空间为4K localStorage 支持5M一张图了解下客户端浏览器的存储发展史浏览器支持情况Feature Chrome Firefox Internet Explorer Opera Safari Andr... ...
目录
(为您整理了一些要点),点击可以直达。
什么是localStorage
HTML5加入了localStorage，作为客户本地存储文件，之前用cookie，但是每条cookie空间为4K localStorage 支持5M
一张图了解下客户端浏览器的存储发展史
浏览器支持情况
Feature Chrome Firefox Internet Explorer Opera Safari Android Opera Mobile Safari Mobile
localStorage 4 3.5 8 10.50 4 2.1 11 iOS 3.2
sessionStorage 5 2 8 10.50 4 2.1 11 iOS 3.2
特点
判断localStorage
if(!window.localStorage){
alert("浏览器支持localstorage");
return false;
}else{
//开始浪
}
HTML5 localStorage 增删改遍历
var storage=window.localStorage;
storage.setItem("name","tom");
官方不太推荐，但是支持的写法
storage["name"]="tom";
storage.name="tom";
var a1=storage.getItem("name");
官方不太推荐，但是支持的写法
var a2=storage.name;
var a3=storage["name"];
更新？html5的localStorage 存的时候是单键值对 key-value模式，重新写一遍name就是更新了
storage.setItem("name","Jack");
storage.removeItem("name");
var storage=window.localStorage;
storage.setItem("name1","tom");
storage.setItem("name2","jack");
storage.setItem("name3","Lucy");
for(var i=0;i<storage.length;i++){
var key = storage.key(i);
var value = storage.getItem(key);
console.log(key + " - " + value);
}
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>测试localStorage</title>
</head>
<script>
if(!window.localStorage){
alert("浏览器不支持localstorage");
}else{
var storage=window.localStorage;
storage.setItem("a","tom");
console.log(typeof storage["a"]);
//第一种方法读取
var a1=storage.getItem("a");
console.log(a1);
}
</script>
<body>
</body>
</html>
https://java-er.com/blog/html5-localstorage-all
MORE================
html5 localStorage缓存音乐和视频
H5 localStorage 缓存图片
H5 本地缓存localStorage缓存计数器
HTML5的localStorage缓存详解的详细内容，希望对您有所帮助，信息来源于网络。