保存javascript函数

Question

我正在使用 javascript 函数来更改带有数据集的某些图标的颜色。 我不知道如何使我通过单击更改的颜色保持这种状态。

这是javascript函数：

window.onload = oppdater;

function oppdater() {

   const clickHandler = function () {
        this.style.color = 
          this.style.color != this.dataset.activeColor ?
          this.dataset.activeColor :
          this.dataset.disabledColor;
      };
    
    for (const element of document.querySelectorAll(".active-color-aware")) {
      element.onclick = clickHandler;
    }

}

<div>
<img src="img/mug_test.png" height="200px" width="200px">
            <p>fillifjonka grå</p>
            <div id="icon_colors" class="center_icon_text">
            <i data-active-color="green" data-disabled-color="#6080a0" class="fas fa-home fa-3x active-color-aware"></i>
            <i data-active-color="yellow" data-disabled-color="#6080a0" class="fas fa-grin-hearts fa-3x active-color-aware"></i>
            <i data-active-color="red" data-disabled-color="#6080a0" class="fas fa-heart-broken fa-3x active-color-aware"></i>
            </div>  
        </div>

Answer 1

如果你想在用户关闭浏览器后保存信息事件，你可以利用localstorage

// Save
localStorage.setItem("activeColor", "red");
// Get
var activeColor = localStorage.getItem("activeColor");