Using localstorage on like buttons

user_17411430 0
Viewed 288

I have a code which is changing colour of thumb when it is clicked:

<button class="like" onclick="like(this)"><i class="fa fa-thumbs-up"></i></button> 


var state = true;

function like(element){
    if(state){
        var  currentElement = element.querySelector('.fa-thumbs-up');
        currentElement.style.color = "orange";

    }else{
        var  currentElement = element.querySelector('.fa-thumbs-up');
        currentElement.style.color = "black";
    }
    state = !state;
}

I want to save the colour in localstorage: User click on like and it is liked untill he dislike it (no when he refreshed).

local-storage javascript
1 Answers

You can use localSotrage.setItem(key, value) for storing the data and localStorage.getItem(key) to retreive the data.

For the case you wanted use like this


var state = true;

function like(element){
    if(state){
        var  currentElement = element.querySelector('.fa-thumbs-up');
        currentElement.style.color = "orange";
        localStorage.setItem("storedColor", "orange");

    }else{
        var  currentElement = element.querySelector('.fa-thumbs-up');
        currentElement.style.color = "black";
        localStorage.setItem("storedColor", "black");
    }
    state = !state;
}

window.addEventListener('DOMContentLoaded', e => {
    currentElement.style.color = localStorage.getItem("storedColor");
});
user_170027720
Related