Javascript 如何在刷新页面时保持CSS更改？

我有一个代码，可以在单击页面上的链接时更改某些项目的显示。如何防止在刷新页面时重置这些显示

我的HTML代码如下所示：

<li id="home-link" class="nav-links">Home</li>

---

这是实现这样一个特性的一种相当迂回的方式我对这件事很陌生JavaScript只是一个用来实现这一点的奇怪工具。这应该被视为最后的手段。当您使用javascript更改页面时，这些更改都会在重新加载时丢失，因此您需要再次执行。这实际上意味着，您需要一个加载事件来检测加载的页面，然后更改样式，而不是单击事件。使用javascript的缺点是，在元素存在之前，它无法更改样式，因此可能会导致标题的闪烁未正确设置样式。您可以使用localStorage找到保存页面视觉状态的方法。但这并不是建议的做法。

$('#home-link').click(function () {
   $('#home').css({
      "opacity": "0",
      "display": "block",
   }).show().animate({ opacity: 1 });

   $('#about-me').hide();

   $('#portfolio').hide();

   $('#contact').hide();
});