Question

所以我设法得到了一个代码，允许我在我的网站主体上切换不同的背景图像，并使用localStorage在访问网站上的不同页面时保持这种变化。我尝试添加一些代码，这些代码对我在CSS中定义的#header类的颜色做了相同的操作。它会改变颜色，但不会保持变化，即使我使用相同的方法。

改变颜色的Javascript函数：

function changeColor(bc) {
    var myElement = document.querySelector("#header");
    myElement.style.color = bc;
    localStorage['bc']=bc;
}

切换颜色：

<a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('switchoff','','images/switchoffhl.jpg',1)" onclick="changeBg('url(images/woodback.png)');changeColor('#000');" 
        style="background-image:url('images/woodback.png')"><img src="images/switchoff.jpg" width="50" height="50" id="switchoff"></a>

标题的CSS：

#header {
    padding:20px;   
    color:#FFF;
    text-align:center;
    font-size:36px;
    text-shadow:#FFF 0 0 0px;
    font-family:Verdana, Geneva, sans-serif;
    clear:both;
}

最后保持背景图像不变的功能，但不对颜色做同样的事情：

(function () {
    if (!localStorage['bg']) localStorage['bg'] = "url(images/woodback.png)";
    document.body.style.background = localStorage['bg'];
    var myElement = document.querySelector("#header");
    if (!localStorage['bc']) localStorage['bc'] = "#FFF";
    myElement.style.color = localStorage['bc'];
})();

有人可以发现任何我可能错过或错过的东西吗？

谢谢！

对localStorage功能进行故障排除

0 个答案: