如何在不同的页面上实现对CSS样式的更改
如何在不同的页面上实现对CSS样式的更改
提问于 2015-10-17 01:57:34
所以我正在做一个网站，有几个页面调用相同的CSS文件。我正在加入一种方法来改变网站的背景图像。我使用javascript函数让它在每个页面上本地工作：
function bgChange(bg) {
document.body.style.background = bg;
}在脚本部分中定义，然后实现它：
<a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('switchon','','images/switchonhl.jpg',1)" onclick="bgChange(this.style.backgroundImage)"
style="background-image:url('images/woodbacklight.jpg')"><img src="images/switchon.jpg" width="50" height="50" id="switchon"></a>但是，当您转到站点上的其他页面时，它将恢复为原始图像。有没有办法在不同的页面上保持设置？
谢谢!
回答 2
Stack Overflow用户
发布于 2015-10-17 02:03:24
我首先想到的是localStorage，但是localStorage可以直接在客户机上修改。如果这对你来说没问题，那么这是我的第一个建议(因为根据我的经验，它很容易使用)。
在客户端上存储数据的一些可能方式：
- 本地Storage
- Session Storage
- Cookies
在服务器上存储数据的一些可能方式：
- MySQL
- MongoDB
- Redis
localStorage的使用示例(在每个页面上)
(function () {
// default background image
if (!localStorage['bg']) localStorage['bg'] = "/path/to/some/default_image.png";
document.body.style.background = localStorage['bg'];
})();然后设置变量：
function changeBg(bg) {
localStorage['bg'] = bg;
};Stack Overflow用户
发布于 2015-10-17 02:03:39
首先编辑您的代码以将bg保存在localStorage(或cookies或sessionStorage)中
function bgChange(bg) {
document.body.style.background = bg;
localStorage.setItem('bgcolor', bg);
}并将此添加到您拥有的每个页面的页面加载中。
document.onload = function(){
bg = localStorage.getItem('bg');
document.body.style.background = bg;
};页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/33176739
复制相关文章
相似问题
腾讯云开发者
