<!DOCTYPE html><html lang="en" xmlns="http://www.w3.org/1999/html"><head><meta charset="UTF-8"><title>这是第一个页面 用户设置 users.html</title></head><body><script>// localStorage 本地储存网页背景、字体颜色function setBgColor() {var color = window.prompt("请输入背景颜色");localStorage.setItem('bgcolor', color);}function setFontColor(color) {color = window.prompt("请输入字体颜色");localStorage.setItem('fontcolor', color);}</script><div align="center"><br><br><br><br><br><br><br><br><h1>第一个设置页面<br><br><input type="button" onclick="setBgColor()" value="设置首页背景色"><input type="button" onclick="setFontColor()" value="设置首页字体色"><br><br><a href="index.html">进去首页</a></h1></div></body></html>
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>这是第二个页面 进入首页 index.html</title><style id="css"></style></head><body><script>window.onload=function(){var bgcolor= localStorage.getItem('bgcolor');var fontcolor = localStorage.getItem('fontcolor');var sto = document.getElementById('css');console.log(bgcolor);sto.innerText=' * {background-color:'+bgcolor+';color:'+fontcolor+';}';}</script><div align="center"><br><br><br><br><br><br><br><br><h1>第二个页面样式</h1><br><h2>关闭浏览器当前页面，下次重新进入会保留上次的样式设置</h2><h1><a href="users.html">返回设置页面</a><a href="index.html" onclick="window.localStorage.clear();">清除页面样式</a></h1></div></body></html>
var color = window.prompt(“请输入背景颜色”); //声明变量存储数据localStorage.setItem(‘bgcolor’, color); //将变量color存储到bgcolor字段
var bgcolor= localStorage.getItem(‘bgcolor’);//第二个页面读取window.localStorage.clear(); //清除页面样式
相关推荐
