Saving the content of the src attribute in the localstorage

Question

I am developping an online os And i want to save the application icons in the localstorage but i don't know how i should save the content of the src attribute in the localstorage and read it out again on the apps page. my current code results in a blank page.

score 0 · Answer 1 · answered Aug 04 '11 at 12:23

0

As far as I know there is no way to do it. Everything you could save to local storage must be referenced by a variable. And the value would be converted into string format when call localStorage.setItem method.

localStorage.setItem('my', {a: 1});

console.log(localStorage['my']); // you will get a string value: '[object Object]'

answered Aug 04 '11 at 12:23

jz1108

1,300
1
11
14

Actually you can save objects by JSON encoding them. Several browsers support `JSON.stringify` and `JSON.parse`. I believe this is native to IE8, Opera 10.50, Firefox 3.5, Safari 4.0.3 and Chrome. There are also various libraries around to provide this if it's not native to the browser. See also [json.org](http://www.json.org/js.html) – Luke H Aug 11 '11 at 20:55
What i mean is that everything you set to localstorage will be converted to string format. Of course you can stringify an object to string format if you will. – jz1108 Aug 25 '11 at 11:59

score 0 · Accepted Answer · edited May 23 '17 at 10:34

0

Are you simply trying to save the source URL? Or the image content?

You can save source URL by something like the following:

var theImage = document.getElementById('my-special-image');
if (window.localStorage) {
     window.localStorage['theImage_src'] = theImage.src;
}

If you want to save the contents of the image, then you have to do some fiddling around with canvas, using canvas.toDataURL(). See this post for more info on how to do that.

edited May 23 '17 at 10:34

Community

1
1

answered Aug 11 '11 at 20:49

Luke H

3,125
27
31

Also, you may want to look into CSS sprites, by the sound of your question. http://www.alistapart.com/articles/sprites – Luke H Mar 07 '12 at 00:06

score 0 · Answer 3 · answered Aug 11 '11 at 21:02

Are the icons user supplied or your own? In either case, convert your application icons to base64. Then stick it into localStorage. Of course you'll have to stringify the data to store.

var base64 = localStorage.getItem('icon_name');
$('#imgid').attr('src', base64);

Saving the content of the src attribute in the localstorage

3 Answers3