标签：重置 方式 需要 是的 alert 特点 tomcat服务 rem color
既然涉及到HTML5知识，那么必定会存在一定的兼容性问题，这里就涉及到浏览器的支持情况了。
浏览器支持情况：
Internet Explorer 8+, Firefox, Opera, Chrome, 和 Safari支持Web 存储。
注意: Internet Explorer 7 及更早IE版本不支持web 存储.
这里涉及到两种方式，即localStorage与sessionStorage
（1）、localStorage：
localStorage（本地存储）,可以长期存储数据，没有时间限制，一天，一年，两年甚至更长，数据都可以使用。localStorage中一般浏览器支持的是5M大小，这个在不同的浏览器中localStorage会有所不同。
优点：
虽然存储大小有限制，但是相对于cookie而言，要大得多。
缺点：
需要手动删除，否则长期存在
浏览器大小不一，版本的支持也不一样
localStorage只支持string类型的存储，JSON对象需要转换
常见用法有：
提示: 键/值对通常以字符串存储
（2）、sessionStorage：
sessionStorage（会话存储），只有在浏览器被关闭之前使用，创建另一个页面时同意可以使用，关闭浏览器之后数据就会消失
特点：
if(typeof(Storage)!=="undefined")
{
// 是的! 支持 localStorage sessionStorage 对象!
// 一些代码.....
} else {
// 抱歉! 不支持 web 存储。
}
这里以localStorage为例来说明（例子是直接从别处copy来的，但这不是重点）：
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script>
function clickCounter(){
if(typeof(Storage)!=="undefined"){
if (localStorage.clickcount){
localStorage.clickcount=Number(localStorage.clickcount)+1;
}else{
localStorage.clickcount=1;
}
document.getElementById("result").innerHTML=" 你已经点击了按钮 " + localStorage.clickcount + " 次 ";
}else{
document.getElementById("result").innerHTML="对不起，您的浏览器不支持 web 存储。";
}
}
</script>
</head>
<body>
<p><button onclick="clickCounter()" type="button">点我！</button></p>
<div id="result"></div>
<p>点击该按钮查看计数器的增加。</p>
<p>关闭浏览器选项卡(或窗口),重新打开此页面,计数器将继续计数(不是重置)。</p>
</body>
</html>
在这里我分别使用了Chrome、Firefox、Safari、QQ、IE（我电脑用的是IE11）、Edge等浏览器来进行测试，发现在Chrome、Firefox、Safari、QQ浏览器上能够实现预期的效果，而在IE与Edge浏览器上则无法达到预期的效果。本来以为浏览器缓存的原因，在清楚缓存后依旧无效，顿时产生了IE浏览器是否支持localStorage的想法，这里以一个小demo来测试下：
<script>
if(window.localStorage){
alert("support")
}else{
alert("not support")
}
</script>
结果IE浏览器下结果为：
标签：重置 方式 需要 是的 alert 特点 tomcat服务 rem color
原文地址：https://www.cnblogs.com/sunjuncoder/p/9895707.html
