<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>网页换肤</title>
<script type="text/javascript">
//检查浏览器是否支持localStorage
if(typeof localStorage===‘undefined‘){
window.alert("not support localStorage");
}else{
window.alert("support localStorage");
var storage = localStorage;
//设置DIV背景颜色为红色，并保存localStorage
function redSet(){
var value = "red";
document.getElementById("divblock").style.backgroundColor = value;
window.localStorage.setItem("DivBackGroundColor",value);
}
function greenSet(){
var value = "green";
document.getElementById("divblock").style.backgroundColor = value;
window.localStorage.setItem("DivBackGroundColor",value);
}
function blueSet(){
var value = "blue";
document.getElementById("divblock").style.backgroundColor = value;
window.localStorage.setItem("DivBackGroundColor",value);
}
function colorload(){
document.getElementById("divblock").style.backgroundColor = window.localStorage.getItem("DivBackGroundColor");
}
}
</script>
</head>
<body onload="colorload()">
<section id="main">
<button id="redbutton" onclick="redSet()">红色</button>
<button id="greenbutton" onclick="greenSet()">绿色</button>
<button id="bluebutton" onclick="blueSet()">蓝色</button>
<div id="divblock" style="width: 500px; height: 500px;"></div>
</section>
</body>
</html>
原文：http://www.cnblogs.com/zhuiluoyu/p/4568735.html