2

我只是想知道有没有办法将 CSS 属性从一个页面带到另一个页面。

让我简要描述一下 - 我有两个网页，分别称为one.html和two.html。里面有one.html个按钮叫darkview。如果用户点击按钮，那么 one.html背景颜色将会改变。

在同一页面中，我有一个链接。当用户单击它时，它将转到第二页 ( two.html)。但现在的问题是：我已经更改了 one.html 中的背景颜色，我希望它也适用于第二页。那么如何获取该属性并应用于第二页呢？

这是我编写的几行代码。

（问题可以通过使用 JavaScript 或 jQuery 来解决。）

4

3 回答 3

2

您可以使用localStorage或sessionStorage保留浏览器级别的设置，或者您可以在可以保持当前状态的 Web 服务器上进行会话。

Http 是无状态的，这意味着它无法记住以前的状态或请求，这就是创建会话的原因，或者在客户端、本地存储、会话存储甚至 cookie 上。只需将状态保存到变量 inlocalStorage并在pageLoad.

于 2012-12-03T12:34:08.247 回答
1

您可以使用 cookie 来存储状态并简单检查 cookie 是否存在以及值是什么。有没有cookie，开关做默认。

function setCookie(c_name,value,exdays)
{
var exdate=new Date();
exdate.setDate(exdate.getDate() + exdays);
var c_value=escape(value) + ((exdays==null) ? "" : "; expires="+exdate.toUTCString());
document.cookie=c_name + "=" + c_value;
}

function getCookie(c_name)
{
var i,x,y,ARRcookies=document.cookie.split(";");
for (i=0;i<ARRcookies.length;i++)
{
  x=ARRcookies[i].substr(0,ARRcookies[i].indexOf("="));
  y=ARRcookies[i].substr(ARRcookies[i].indexOf("=")+1);
  x=x.replace(/^\s+|\s+$/g,"");
  if (x==c_name)
    {
    return unescape(y);
    }
  }
}
function checkCookie()
{
var theme=getCookie("theme");
  if (theme!=null && theme!="")
  {
  setTheme(theme);
  }
else 
  {
  theme="light";
  if (theme!=null && theme!="")
    {
    setCookie("theme",theme,365);
    }
  }
}
于 2012-12-03T12:38:48.583 回答
0

猜猜这有帮助。您可以将 sessionStorage 用于临时客户端存储。如果要保留值，可以使用 localStorage

一.html

<form>
     <input type="button" value="darkview" id="newColor"  />
</form>
<script>
window.onload = function() {
    var color = document.getElementById('newColor');
    color.onclick = function() {
        document.body.style.backgroundColor = '#ddd';
        window.sessionStorage['currentColor'] = '#ddd';
    }
}
</script>

Two.html

<script>
window.onload = function() {
    var color = window.sessionStorage['currentColor'];
    document.body.style.backgroundColor = color;
    }
}
</script>
于 2012-12-03T12:36:51.510 回答