将图像保存到本地存储

时间:2018-10-22 23:14:36

标签: javascript local-storage

我正在一个有两个样式表可供选择的项目-深色和浅色。

所以,我的代码做了什么-它更改了样式表的href标签和两个小图标src(徽标和一些图标)。然后将最近使用的样式表保存到本地存储。

function ChangeMode() {
                var image = document.getElementById("mode");
                var logo = document.getElementById("logo");
                if (image.src.match("day_mode")) {
                    image.src = "night_mode_s.png";
                    logo.src = "logo_black.png";
                    document.getElementById("stylesheet").setAttribute('href', 'main_dark.css');

                } else {
                    image.src = "day_mode_s.png";
                    logo.src = "logo.png";
                    document.getElementById("stylesheet").setAttribute('href', 'main.css');
                }  
            }  

                if (localStorage.getItem("ModeChanger")) {
                    document.getElementById("stylesheet").setAttribute("href", localStorage.getItem("ModeChanger"));
                }

                  function MyStylesheet() {
                        var x = document.getElementById("stylesheet").getAttribute("href");
                        document.getElementById("stylesheet").setAttribute("href", x);
                        localStorage.setItem("ModeChanger", x); 

                  }`

我现在需要做的是将图像的src保存到本地存储。我试图更改函数MyStylesheet中的键和值,但是Chrome表示出了点问题。

我的问题是-将图像保存到本地存储时是否有不同的规则?对我来说似乎合乎逻辑的是使用这个稍微改变的功能

var y = document.getElementById("mode").getAttribute("src");
document.getElementById("mode").setAttribute("src", y);
localStorage.setItem("ModeChangerTwo", y); 

然后在上面的函数中引用它。

发送帮助。

2 个答案:

答案 0 :(得分:0)

您只能在本地存储中存储字符串,请尝试以下操作:

localStorage.setItem("ModeChangerTwo", JSON.stringify(y));

假设您的变量包含url属性或是对象引用,而modeChangerTwo将是其键。

并使用以下方法获取值:

 y = JSON.parse(localStorage.getItem('ModeChangerTwo'));

在Javascript对象中再次将其转换。

答案 1 :(得分:0)

谢谢大家的帮助,尤其是@ChrisG。您的方法似乎是最简单的方法,所以我使用了它。

我做了另一个完全不使用局部笔触的功能。看起来像这样,而且有效!

[[[0, 0], [0, 0], [0, 0]], [[0, 0]]]
[[[0, 0], [0, 0], [0, 0]], [[0, 0]], [[0, 0]]]