标签:
<!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